Late binding in jquery?
<p>There is a table which has one row:</p>

<pre><code>&lt;table&gt;
  &lt;tr&gt;&lt;td&gt;&lt;span class="removeItem"&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p>I use this to bind a function to a class:</p>

<pre><code>  $('.removeItem').bind('click', function() {
    $(this).parent().remove();
    return false;
  });
</code></pre>

<p>later, I add rows with the same class name (.removeItem) into the table:</p>

<pre><code>var newRow = '&lt;tr&gt;&lt;td&gt;&lt;span class="removeItem"&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;';
$(table).append(newRow);
</code></pre>

<p>When I click on the first row item, it is removed. The dynamically added one is not.</p>

<p>Why is this?</p>
