Adding duplicate elements by javascript

Question

I am new in Javascript.I need to add duplicate same elements when I click on add more button to add the whole body elements dynamically.Here are the image of my code

Image

How to do that ? I need your suggestion.Thanks in advance.

@GauravAggarwal please don't remove tags that are relevant to the question. The OP has tagged jquery therefore you would image they would accept a jQuery solution. — Liam, Apr 25 '16 at 10:44
Yeah but he want to do it javascript only so question should not be tagged as jquery — Gaurav Aggarwal, Apr 25 '16 at 10:45
@GauravAggarwal manytime ppl tend to address jQuery as javascript unless they mention explicitly "Native/Vanila JS" its natural to think he accepts jQuery as he had tagged jQuery — RRR, Apr 25 '16 at 10:49
JQUERY is a library function of Javascript.So when a beginner found any problem regarding this javascript he should tag javascript and jquery both .. that's why he may get help... @RoryMcCrossan thanks mate i can do it but the another problem is that i cannot binding the events how to do that — Nijar Hossain, Apr 25 '16 at 10:58
You need to use a delegated event handler, `$parentElement.on('event', 'element selector', func);`. See http://api.jquery.com/on/#on-events-selector-data — Rory McCrossan, Apr 25 '16 at 11:03

score 2 · Accepted Answer · answered Apr 25 '16 at 10:44

2

You can do it with native javascript

element2 = element1.cloneNode(bool)

Here boolean indicates whether to clone child nodes or not

answered Apr 25 '16 at 10:44

Gaurav Aggarwal

9,809
6
36
74

1

clone() works well,but how to binding the events of javascript?? thanks by the way... – Nijar Hossain Apr 25 '16 at 10:59

score 2 · Answer 2 · answered Apr 25 '16 at 10:45

You can do it easily in js easily via cloneNode

function cloneFunction() {
    var para = document.getElementById("para-1");
    var cln = para.cloneNode(true);
    document.getElementById("parent").appendChild(cln);
}

<div id="parent">
<p id="para-1">Lorem Ipsum</p>
</div>

<button onclick="cloneFunction()">clone it</button>

Adding duplicate elements by javascript

2 Answers2