Change certain paragraph text in jQuery?

Question

I was wondering if it was possible to change text dynamically in jQuery.

I want to display this in HTML --

A [dynamic animal name] is my favourite pet.

meaning that

[dynamic animal name]

should be inside an array of words, say

var wordArray = [cat, dog, cow]

How would i go about seperating the paragraphs into one that can be dynamically changed?

I was trying

<p>A <p id="special">[wordArray goes here]</p> is my favourite pet.</p>

but it turns out like this in html:

A cow

is my favourite pet.

meaning it breaks the whole line of words into 2 seperate sentences.

How do i make it go together?

Matthias Tylkowski · Accepted Answer · 2012-04-21 06:27:59Z

3

Instead of ... use a  ... 

spanis an inline element and will not break the view.

Another solution is to use css to make the  element inline:

p#special{
    display:inline;
}

answered Apr 21, 2012 at 6:27

Matthias Tylkowski

5179 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Kyle Yeo Over a year ago

thank you for providing more than a single answer. that really helped!

Shaikh Farooque · Accepted Answer · 2012-04-21 06:28:42Z

2

 tag will be the correct one instead of  tag for dynamic animal name

answered Apr 21, 2012 at 6:28

Shaikh Farooque

2,6402 gold badges22 silver badges36 bronze badges

Comments

Ram · Accepted Answer · 2012-04-21 06:27:42Z

1

try this:

<p>A <span id="special"></span> is my favourite pet.</p>

var animals = ["cat", "dog", "cow"];

$("#special").text(animals[0]);

answered Apr 21, 2012 at 6:27

Ram

145k16 gold badges174 silver badges201 bronze badges

Comments

black sowl · Accepted Answer · 2012-04-21 06:28:22Z

1

Change it to:

<p>A <span id="special">[wordArray goes here]</span> is my favourite pet.</p>

You're using nested tags that is why it's breaking into sentences/paragraphs.

answered Apr 21, 2012 at 6:28

black sowl

1954 bronze badges

Comments

scessor · Accepted Answer · 2012-04-21 06:31:05Z

1

Use a span-tag for the animal:

HTML:

<p>A <span id="special">[wordArray goes here]</span> is my favourite pet.</p>

javascript:

$('#special').text(wordArray[2]);

Also see this example.

edited Apr 21, 2012 at 6:31

answered Apr 21, 2012 at 6:25

scessor

16.1k4 gold badges45 silver badges55 bronze badges

Collectives™ on Stack Overflow

Change certain paragraph text in jQuery?

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related