How to insert a DIV into another DIV with JQuery?

Question

How do I add a custom DIV to an already existing DIV with JQuery?

<div id="old-block"><div id="new-block">Lorem Ipsum</div></div>

Thanks in advance.

$('#old-block').append('
'); will get you a div inside old-block — joyBlanks, Aug 14 '15 at 11:41
possible duplicate of [insert element in the dom using javascript or jquery](http://stackoverflow.com/questions/6839328/insert-element-in-the-dom-using-javascript-or-jquery) — Mathlight, Aug 14 '15 at 11:44

score 20 · Accepted Answer · edited May 23 '17 at 12:32

There are many ways to insert a div inside another div.

We can use .append() to do it like this:

$('#old-block').append('<div id="new-block-2"></div>');

We can also use .appendTo() like this:

$('<div id="new-block-2"></div>').appendTo('#old-block');

Maybe we feel not so fancy today and want to use plain JavaScript:

document.getElementById('old-block').appendChild('div');

document.getElementById('old-block').innerHTML += '<div id="new-block-2"></div>';

score 0 · Answer 2 · answered Aug 14 '15 at 11:42

0

$("#old-block").append("<div id='dynamic'></div>");

answered Aug 14 '15 at 11:42

Sagar

2 Answers2