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.
-
1http:\\api.jquery.comRajaprabhu Aravindasamy– Rajaprabhu Aravindasamy2015-08-14 11:41:31 +00:00Commented Aug 14, 2015 at 11:41
-
$('#old-block').append('<div>'); will get you a div inside old-blockJoy Biswas– Joy Biswas2015-08-14 11:41:33 +00:00Commented Aug 14, 2015 at 11:41
-
possible duplicate of insert element in the dom using javascript or jqueryMathlight– Mathlight2015-08-14 11:44:58 +00:00Commented Aug 14, 2015 at 11:44
Add a comment
|
2 Answers
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>';
You could also try parsing the HTML with RegEx.
Comments
$("#old-block").append("<div id='dynamic'></div>");
