Alireza Noori
Alireza Noori

Reputation: 15243

jQuery - .appendTo a specific part of an object

I have a jQuery object (named wid) that has a code similar to this:

<li class='widget'>
    <div class='widget-head'>
        <h3>head</h3></div>
    <div class='widget-content'>
        <p>LINE1</p>
        <p>LINE2</p>
    </div>
</li>

I want to append <p>LINE3</p> after the last line of the content. Currently I'm doing this:

var content = $('.widget-content');
var $newItem = $('<p>LINE3</p>').appendTo($(content).last(), wid);

but the problem is that it appends the line to the last line of the last gadget (not wid). How can I make it append to the last line of the wid and not the last widget?

Upvotes: 1

Views: 132

Answers (2)

Adam Jurczyk
Adam Jurczyk

Reputation: 2131

var content = $('.widget-content', wid); //or beter wid.find('.widget-content');
var $newItem = $('<p>LINE3</p>').appendTo(content);

You missplaced context - it should be in content query. Also, you dont have to wrap again content into jq object, and assuming you have only one content in widget, you dont have to use last.

Upvotes: 3

Samich
Samich

Reputation: 30095

Try following:

$('<p>LINE3</p>').appendTo(wid.find('.widget-content'));

According to documentation .appendTo() doesnt' have overloaded function with 2 params.

Upvotes: 3

Related Questions