How to duplicate a specific element on page load by JQuery

If you want to duplicate a specific element from your web page, follow these steps:



1. First of all add some HTML code in your code file, like this:

<div class="container">
    <div class="demo">We are duplicating this bottom element:</div>
    <div class="test">text to be duplicated.</div>
</div>


2. Then use clone() function to duplicate this element, like this:

jQuery(document).ready(function(){
    var myvar = jQuery(".test").clone();

    jQuery(myvar).insertAfter(".test");
});


Now you will see your target element will duplicate after full page loaded, and output code will look like this:

   <div class="demo">We are duplicating this bottom element:</div>
    <div class="test">text to be duplicated.</div>
    <div class="test">text to be duplicated.</div>
</div>