Using Javascript to generate unique IDs for div tags (html) -

i have following html code:

<div id="id_unique"></div>  <span class="a_random_class">a</span> <span class="a_random_class">b</span> <span class="a_random_class">c</span> 

and javascript

<script> settimeout(function() {    var element = document.getelementbyid("an_id");      array.prototype.foreach.call(document.queryselectorall(".a_random_class"), function(e) {      var example = element.appendchild(e.clonenode(true));         example.classname += " timeline-date";      var div = document.createelement('div');         div.id = "id_frame";      div.appendchild(example);        element.appendchild(div);    }); }, 300); </script> 

it wrap result of clonenode inside html div, , generated div tags have same id id_frame ... since in html ids must unique, how can tell javascript generate unique id each result?

use counter global variable , append id , increment counter after assigning id below:

<script> settimeout(function() {    var element = document.getelementbyid("an_id");      var counter = 0;   array.prototype.foreach.call(document.queryselectorall(".a_random_class"), function(e) {      var example = element.appendchild(e.clonenode(true));         example.classname += " timeline-date";      var div = document.createelement('div');         div.id = "id_frame"+counter;         counter++;     div.appendchild(example);        element.appendchild(div);    }); }, 300); </script>