Deleting multiple selected table rows using only javascript
<p>I would like to delete selected rows in a table using javascript but problem is that once a row is deleted the index changes.</p>

<p>This problem is confounded because only specific rows contain checkboxes and more checkboxes can be added.</p>

<p><strong>I can already obtain all the correct row indexes I wish to delete</strong> inside of an array using javascript but then how would I then go about deleting the rows without hitting the wrong one and without using prototype or jquery. Purely javascript?</p>

<p>Any help is greatly appreciated.</p>

<pre><code> &lt;table class="example_table" id="mytable"&gt;
    &lt;tbody&gt;
          &lt;tr&gt;
                &lt;td&gt;&lt;input type="text" id="top row" /&gt;&lt;/td&gt;
          &lt;/tr&gt;

          &lt;tr&gt;
                &lt;td&gt;&lt;input type="button" onclick="addNewCheckboxRow()" /&gt;&lt;/td&gt; 
          &lt;/tr&gt;

          &lt;tr&gt;
                &lt;td&gt;&lt;input type="button" /&gt;&lt;/td&gt; 
          &lt;/tr&gt;

          &lt;tr&gt;
                &lt;td&gt;&lt;input type="checkbox" value="1" id="check1" /&gt;&lt;/td&gt;  //row that may be deleted
          &lt;/tr&gt;

          &lt;tr&gt;
                &lt;td&gt;&lt;input type="checkbox" value="2" id="check2" /&gt;&lt;/td&gt;  //row that may be deleted
          &lt;/tr&gt;

          &lt;tr&gt;
                &lt;td&gt;&lt;input type="checkbox" value="3" id="check3" /&gt;&lt;/td&gt;  //row that may be deleted
          &lt;/tr&gt;
          &lt;tr&gt;
                &lt;td&gt;&lt;input type="checkbox" value="4" id="check4" /&gt;&lt;/td&gt;  //row that may be deleted
          &lt;/tr&gt;   

          &lt;tr&gt;
                &lt;td&gt;&lt;input type="button" /&gt;&lt;/td&gt; 7
          &lt;/tr&gt;
        &lt;/tbody&gt;
    &lt;/table&gt;
</code></pre>

<p>My current approach. not exact but you can get the drift.</p>

<pre><code>var myrow=["6","7"];

document.getElementById("mytable").deleteRow(myrow[0]); //deletes row 6

document.getElementById("mytable").deleteRow(myrow[1]); //deletes row 7 But
                                                        //the index has changed!

//what happens when after the delete more rows are added!
</code></pre>
