It's possible clone a javascript div id with same function in javascript?

Question

I'm trying to clone javascript div id with this code

<script>

    var div = document.getElementById('pruebaz2'),
                            clone = div.cloneNode(true); // true means clone  all childNodes and all event handlers
    clone.id = "pruebaz2";
    document.body.appendChild(clone);

</script>

but my clone div id not have any effect in my html page
my original id add a record when a doing a click

my clone id do nothing

how I can clone with same functionality

What functionality are you talking about? Could you give a bit more code? — Roman Granovsky, Dec 05 '16 at 17:04
There is a perfect example to be found on W3school.. One of teh first things to pop up when seraching google for 'cloneNode' http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_node_clonenode — Daniel, Dec 05 '16 at 17:05
Each id should be unique on the page. You shouldn't have multiple elements with the same id. Maybe you should use a class? — 4castle, Dec 05 '16 at 17:06
Are you looking to clone not just the element, but the event handlers as well? — JonSG, Dec 05 '16 at 17:07
How do you handle a click? It looks like event delegation should help. — Roman Granovsky, Dec 05 '16 at 17:10

Scott Marcus · Accepted Answer · 2016-12-06T18:40:33.353

Your code is fine. You just didn't put any content into the cloned div so there was nothing to see.

Also, don't give two elements the same id. That defeats the purpose of it.

Lastly, a "deep" clone does not duplicate event handlers. From MDN:

Cloning a node copies all of its attributes and their values, including intrinsic (in–line) listeners. It does not copy event listeners added using addEventListener() or those assigned to element properties. (e.g. node.onclick = fn) Moreover, for a element, the painted image is not copied.

var div = document.getElementById('pruebaz2'),

clone = div.cloneNode(true); // true means clone  all childNodes and all event handlers
clone.id = "pruebaz3";
clone.innerHTML = "Cloned DIV";
document.body.appendChild(clone);

<div id="pruebaz2">Original DIV</div>

I think the OP is looking to clone event handlers – JonSG Dec 05 '16 at 17:07 — JonSG, Dec 05 '16 at 17:07

It's possible clone a javascript div id with same function in javascript?

1 Answers1