dynamically add remove rows in table using jquery
<p>I have construted my table as follows:</p>

<pre><code>    &lt;table id="dataTable"&gt;
            &lt;thead&gt;
                &lt;tr&gt;&lt;th&gt;Name&lt;/th&gt;
               &lt;th&gt;Value&lt;/th&gt;&lt;/tr&gt;
            &lt;/thead&gt;
&lt;TR&gt;&lt;TD&gt;Scooby Doo&lt;/TD&gt;&lt;TD&gt;6&lt;/TD&gt;&lt;TD&gt;&lt;INPUT TYPE="Button"  onClick="AddRow()" VALUE="Add Row"&gt;&lt;/TD&gt;&lt;/TR&gt;
&lt;/table&gt;
</code></pre>

<p>When the button Add Row is clicked, I need to change the button to a delete button and insert a new row on the first line.  The first line must contain the same  as in the code.  How can I do this?</p>

<p>On clicking the delete button,  Imust be able to delete the row to which the delete button belong?</p>
