Dynamically add Div to html page using javascript or jquery

Question

I want to have a main div and have the ability to dynamically add new divs at the same level as the main div. Something like this:

<div id="main"></div>
<div id="created_div"></div>

Any help would be wonderful

Answer 1

$("#parent_div").append('<div id="created_div"></div>');

or if you want the newly created <div>-s to appear before the others

$("#parent_div").prepend('<div id="created_div"></div>');

Answer 2

$('<div id="created_div"></div>').insertAfter('#main');

Answer 3

$('#main').after('<div id="created_div"></div>');