How to repeat div element n times in HTML?

Question

How can I duplicate a <div> so there are n copies using JavaScript?

Start with 1:

<div class="box"></div>

End up with 5:

<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>

Answer 1

im using jquery here. You can place div parent as i used in example "divRepeat"

<div id="divRepeat">
   <div class="box"></div>
</div>

in Jquery

for(var i=0;i<("how many repeat do you want");i++){
   $("#divRepeat").append($(".box").html());
   //you can add other logic here, like you want diferent id or class to add in new box
}

Answer 2

Create a container div with a id and place <div class="box"></div> inside it. Then using jQuery you can run a loop for desired number of time and append divs like

jQuery("#container_div_id").append(jQuery("#container_div_id").children().first().clone())

Check fiddle