Search code examples
jqueryappendwrapall

jQuery append text inside of an existing paragraph tag

I am trying to add additional text to the end of a paragraph using jQuery. My thought was to produce a structure like this:

Judging by my answers I will clarify. I need to create this structure first. And this is the part that I find difficult, not the second end result. So how do I dynamically create this:

<p>old-dynamic-text<span id="add_here"></span></p>

And then after adding the new text it would look like this:

<p>old-dynamic-text<span id="add_here">new-dynamic-text</span></p>

I've been playing with the .wrapAll() method, but I can't quite get the desired effect. Is this the best way to do this (and if so how), or is there another way to append new text to the end of an existing paragraph (that needs to be wrapped in some type of tag since I need to style it differently)?

Solution

  • Try this...

    $('p').append('<span id="add_here">new-dynamic-text</span>');

    OR if there is an existing span, do this.

    $('p').children('span').text('new-dynamic-text');

    DEMO