title: jquery doenst append a count correctly
body: <p>I want to create dynamically rows with jquery and for each new row adding a counting number from 1 to 2 etc. but when i click on add row the first click goes good, but then after that it counts on the existing ones and i only need 1, 2, 3, 4, 5, etc. What am i doing wrong ?</p>
  
  <p>Fiddle: <a href="http://jsfiddle.net/FjQ3V/" rel="nofollow">Click</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="row"&gt;I'm a row&lt;p&gt;&lt;/p&gt;&lt;/div&gt;
  
  &lt;a href="#" class="add_row"&gt;Add Row&lt;/a&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.row {
      width: 100px;
      height: 100px;
      padding: 10px;
      margin: 5px;
      background-color: slateGrey;
      float: left;
  }
  
  a.add_row {
      float: left;
  }
  </code></pre>
  
  <p>JQUERY:</p>
  
  <pre><code>$("a.add_row").click(function() {
  
                  var $row = $("body .row").first().html();
  
                  var $remove_row = ("&lt;a href='#' class='remove_row'&gt;remove&lt;/a&gt;");
  
                  $(this).before("&lt;div class='row'&gt;"+ $row +"&lt;/div&gt;");
  
                  $(this).prev().append($remove_row);
  
                  var count = 0;
  
                  $(".remove_row").click(function() {
  
                      var $remove = $(this).parent();
  
                      $remove.remove();
  
                      return false;
                  });
  
                  $(".row").each(function() {
                      count++;
  
                          $(this).append(count);
  
                  });
  
                  return false;
  
              });
  </code></pre>