title: jQuery Clone function with callback - not working as expected
body: <p>First, here is a JSfiddle with my work: <a href="http://jsfiddle.net/xzGxR/" rel="nofollow">http://jsfiddle.net/xzGxR/</a></p>
  
  <p><strong>The JavaScript:</strong></p>
  
  <pre><code>function dataClonePrototype(JSOtarget, ElementPrototype, callback) {
      for (i = 0; i &lt; JSOtarget.length; i++) {
          var TargetElement;
          if (!Eclone) { // Only create it on first interval
              TargetElement = $(ElementPrototype);
              var Eclone = TargetElement.clone(); // We only want to create a copy of this clone...
          } else {
              TargetElement = Eclone.clone().insertAfter(ElementPrototype);
          }
          callback(TargetElement, JSOtarget[i]);
      }
  }
  
  var returnedJSO = 
  {
      "Animals": [
          {
              "Title": "Dogs",
              "Amount": 300
          },
          {
              "Title": "Pigs",
              "Amount": 230
          },
          {
              "Title": "Cats",
              "Amount": 340
          }
      ]
  }
  
  dataClonePrototype(returnedJSO.Animals, "section#animals", function(Element, JSOtargetAtKey) {
      Element.children("header").html(JSOtargetAtKey.Title);
      Element.children("article").html(JSOtargetAtKey.Amount);
  });​
  </code></pre>
  
  <p><strong>And the HTML:</strong></p>
  
  <pre><code>&lt;section id="animals"&gt;
       &lt;header&gt;&lt;/header&gt;
       &lt;article&gt;&lt;/article&gt;
  &lt;/section&gt;​
  </code></pre>
  
  <p><strong>The output should (visually) look like this:</strong></p>
  
  <pre><code>Dogs
  300
  Pigs
  230
  Cats
  340
  </code></pre>
  
  <p><strong>Yet, it looks like this.</strong></p>
  
  <pre><code>Dogs
  300
  Cats
  340
  Pigs
  230
  Cats
  340
  </code></pre>
  
  <p>The goal of this is to use the HTML and create clones of it - then populate these clones with data from the javascript object. It should populate like this:</p>
  
  <pre><code>&lt;section id="animals"&gt;
     &lt;header&gt;Dogs&lt;/header&gt;
     &lt;article&gt;300&lt;/article&gt;
  &lt;/section&gt;​
  </code></pre>
  
  <p>Something is wrong with the code that clones, but I can't figure out what. Any advice/help is really appreciated.</p>