Delete a table row with javascript / jquery
<p>This is not working. Firebug is not throwing any error though. </p>

<p>HTML:   </p>

<pre><code>&lt;table&gt;
       &lt;tr&gt;&lt;td&gt;BookA&lt;/td&gt;&lt;td&gt;&lt;a href="javascript:deleteRow($(this));" class="red"&gt;Delete&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
       &lt;tr&gt;&lt;td&gt;BookB&lt;/td&gt;&lt;td&gt;&lt;a href="javascript:deleteRow($(this));" class="red"&gt;Delete&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
        &lt;tr&gt;&lt;td&gt;BookC&lt;/td&gt;&lt;td&gt;&lt;a href="javascript:deleteRow($(this));" class="red"&gt;Delete&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
        &lt;tr&gt;&lt;td&gt;BookD&lt;/td&gt;&lt;td&gt;&lt;a href="javascript:deleteRow($(this));" class="red"&gt;Delete&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p>Javascript:</p>

<pre><code>function deleteRow(ref) {   
    $(ref).parent().parent().remove(); 
 }
</code></pre>

<p><strong>If possible, I would like to use a solution with inline javascript</strong></p>
