title: Cloning an element multiple times
body: <p>I have a <code>li element</code> parented to a <code>div</code> with <code>id</code> <code>holder</code>. I need to clone the <code>li</code> multiple times, have all the clones parented to the <code>holder div</code> and change their <code>data-ids</code>. My hierarchy looks like this:</p>
  
  <pre><code>&lt;div id="holder"&gt;
      &lt;li data-id=0 class="element"&gt;
          //other nodes
      &lt;/li&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How can I clone the <code>li element</code> and than change it's <code>data-id</code> so I get:</p>
  
  <pre><code>&lt;div id="holder"&gt;
      &lt;li data-id=0 class="element"&gt;
          //other nodes
      &lt;/li&gt;
      &lt;li data-id=1 class="element"&gt;
          //other nodes
      &lt;/li&gt;
      &lt;li data-id=2 class="element"&gt;
          //other nodes
      &lt;/li&gt;
      &lt;li data-id=3 class="element"&gt;
          //other nodes
      &lt;/li&gt;
      &lt;li data-id=4 class="element"&gt;
          //other nodes
      &lt;/li&gt;
      &lt;li data-id=5 class="element"&gt;
          //other nodes
      &lt;/li&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>-- David</p>