title: jQuery: stumped while trying to select dynamically created span
body: <p>I have a dynamically created <code>&lt;span class="remove-row"&gt;</code>, and I can't get the <code>click()</code> event to fire.  Being relatively green in JS still, I'm <em><strong>guessing</strong></em> my problem is with my selector.</p>
  
  <p>It can all be seen <strong><a href="http://jsfiddle.net/mOrloff/48nbs/21/" rel="nofollow">here on jsFiddle</a></strong>.<br>
  (see the very bottom of the JS pane)</p>
  
  <p>Here's a skinny version of what the <strong>generated</strong> html looks like:</p>
  
  <pre><code>...
  &lt;section &gt;
      &lt;div class="look-like-input textfield droppable" restrict-children="1" id=""&gt;
          &lt;span class="remove-row"&gt;&lt;span&gt;X&lt;/span&gt;&lt;/span&gt;
      &lt;/div&gt;
      &lt;br /&gt;
      &lt;div class="look-like-input textarea droppable" id="deprecated"&gt;&lt;/div&gt;
  &lt;/section&gt;
  ...
  </code></pre>
  
  <p>And this is how I'm <em><strong>trying</strong></em> to get the click event:</p>
  
  <pre><code>...
  $(".remove-row").click(function() {
      alert("Hello");
  });
  </code></pre>