title: Select tr by id with Jquery
body: <p>I'm trying select a tr inside a table to delete it but am not having any luck with selectors.</p>
  
  <p>Table looks like this:</p>
  
  <pre><code>&lt;table width="301" border="0" cellspacing="5" cellpadding="0" id="selectedproducts" ==""&gt;
        &lt;tbody&gt;
          &lt;tr&gt;
            &lt;th width="56" scope="col"&gt;Product:&lt;/th&gt;
            &lt;th width="48" scope="col"&gt;Size:&lt;/th&gt;
            &lt;th width="71" scope="col"&gt;Colour:&lt;/th&gt;
            &lt;th width="41" scope="col"&gt;Qty&lt;/th&gt;
            &lt;th width="55" scope="col"&gt;Price&lt;/th&gt;
            &lt;th width="55" scope="col"&gt;Delete&lt;/th&gt;
          &lt;/tr&gt;
          &lt;tr id="product_1"&gt;
            &lt;td&gt;Shuttle&lt;/td&gt;
            &lt;td&gt;54.95&lt;/td&gt;
            &lt;td&gt;Red&lt;/td&gt;
            &lt;td&gt;1&lt;/td&gt;
            &lt;td&gt;&lt;/td&gt;
            &lt;td&gt;&lt;a onclick="deleteProduct(id)"&gt;[X]&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr id="product_2"&gt;
            &lt;td&gt;Shuttle&lt;/td&gt;
            &lt;td&gt;54.95&lt;/td&gt;
            &lt;td&gt;Red&lt;/td&gt;
            &lt;td&gt;1&lt;/td&gt;
            &lt;td&gt;&lt;/td&gt;
            &lt;td&gt;&lt;a onclick="deleteProduct(id)"&gt;[X]&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
        &lt;/tbody&gt;
   &lt;/table&gt;
  </code></pre>
  
  <p>The tr's with product id's are dynamically appended with jQuery so not sure if that makes a difference.</p>
  
  <p><code>deleteProduct(id)</code> function looks like this:</p>
  
  <pre><code>function deleteProduct(id) {
   $('#product_' + id).remove();
  }
  </code></pre>
  
  <p>When clicked nothing happens and there are no errors in the Chrome console.</p>
  
  <p>Mucking around a bit in the console: </p>
  
  <p><code>$('#selectedproducts').html();</code> Returns the data
  <code>$('#selectedproducts').find('#product_1').html()</code> returns empty</p>