Build nested jquery object and append to inner element

Question

I am building an jquery object:

 function build(){
     var first = $('<div/>', {
        class: 'first'
    });
    var second = $('<div/>', {
        class: 'second'
    });
    var third = $('<div/>', {
        class: 'third'
    });
    second.append(third);
    return first.append(second);
}

Now I want to append a new element to the third object after it was returned. Tried obj.find('.third').append(...) but this is not working. Any ideas how to do this?

Thanks.

You already have the reference to third, so you can just do third.append('your html here...'); — Rory McCrossan
– Rory McCrossan, Commented Jan 25, 2018 at 9:13
I don't get how obj.find is related, what did you try to do? — fingeron
– fingeron, Commented Jan 25, 2018 at 9:14
no. after return. So i get one object ´var obj = buildStuff()...´ reference is gone — Sardoan
– Sardoan, Commented Jan 25, 2018 at 9:15
Got a function which returns the object with the 3 divs. Now I want to append some ther objects to the inner div of the returned object. — Sardoan
– Sardoan, Commented Jan 25, 2018 at 9:16
In that case we need to see more of your code. What is obj? How are you appending first to the DOM? — Rory McCrossan
– Rory McCrossan, Commented Jan 25, 2018 at 9:16

Hiren Jungi · Accepted Answer · 2018-01-25 09:25:30Z

1

Don't use find method. You can achieve the same with children()

Try this:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
function getme(){
    var first = build();
    var fourth = $('<div/>', {
      class: 'fourth'
    });
    first.children().children().append(fourth)
    console.log(first);
}
function build(){
     var first = $('<div/>', {
        class: 'first'
    });
    var second = $('<div/>', {
        class: 'second'
    });
    var third = $('<div/>', {
        class: 'third'
    });
    second.append(third);
    return first.append(second);
}
</script>
</head>
<body>

<button onclick="getme()"/>

</body>
</html>

edited Jan 25, 2018 at 9:25

answered Jan 25, 2018 at 9:16

Hiren Jungi

8649 silver badges20 bronze badges

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

2 Comments

Sardoan Over a year ago

Edited my code snippet. var obj = build(); Now i want to append to .third of obj.

Sardoan Over a year ago

Worked :) tried it before with children[0].children[0].append :) Thanks a lot :)

Collectives™ on Stack Overflow

Build nested jquery object and append to inner element

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related