Need a delete row function with Checkbox for dynamic form --DOM

[RAPIDFIRE0311]

I need a delete function, I have tried all sorts of things and in this instance I have 2 different functions does not do anything. I just left it here for developmental help. The most I am able to do is delete all rows, **and only want to delete rows which have been checked by checkbox and button deletes on click. **

   <script type="text/javascript">
        var counter = 1;
        var limit = 6;
        function addTextArea() {
         if (counter == limit-1) {
         alert("Maximum limit " + counter + " sorry");
         return false;
         }
         else {
         <!-- CAUTION THIS IS BACKWARDS. -->

         var newdiv = document.createElement('div');
         newdiv.innerHTML = "" + (counter + 1) + " <br><textarea name='fav_det[]' id=counter rows='3' cols='20'>";
         document.getElementById('div6').appendChild(newdiv);

         var newdiv = document.createElement('div');
         newdiv.innerHTML = "" + (counter + 1) + " <br><textarea name='fav_col' id=counter rows='3' cols='20'>";
         document.getElementById('div5').appendChild(newdiv);

         var newdiv = document.createElement('div');
         newdiv.innerHTML = "" + (counter + 1) + " <br><textarea name='fav_mod[]' id=counter rows='3' cols='20'>";
         document.getElementById('div4').appendChild(newdiv);

         var newdiv = document.createElement('div');
         newdiv.innerHTML = " " + (counter + 1) + " <br><input type='text' name='truck[]' id=counter>";
         document.getElementById('div3').appendChild(newdiv);

         var newdiv = document.createElement('div');
         newdiv.innerHTML = " " + (counter + 1) + " <br><input type='text' name='car[]' id=counter>";
         document.getElementById('div2').appendChild(newdiv);

         var newdiv = document.createElement('div');
         newdiv.innerHTML = "" + (counter + 1) + " <br><input type='checkbox' name='chk[]' id=counter>";
         document.getElementById('div1').appendChild(newdiv);

         counter++
         return true;
         }
        }
        </script>


        <script type="text/javascript">
        function  deleteRowS(dataTable) {
            for (var rowi= table.rows.length; rowi-->0;) {
                var row= table.rows[rowi];
                var inputs= row.getElementsByTagName('dataTable');
                for (var inputi= inputs.length; inputi-->0;) {
                    var input= inputs[inputi];

                    if (input.type==='checkbox' && input.checked) {
                        row.parentNode.removeChild(row);
                        break;
                    }
                }
            }
        }
        </script>   



        <script type="text/javascript">
        function deleteRow()  {
                var table = document.getElementById(tableID).tBodies[0];
                var rowCount = table.rows.length;

                // var i=1 to start after header
                for(var i=1; i<rowCount; i++) {
                    var row = table.rows[i];
                    // index of td contain checkbox is 8
                    var chkbox = row.cells[6].getElementsByTagName('input')[0];
                    if('checkbox' == chkbox.type && true == chkbox.checked) {
                        table.deleteRow(i);
                     }
                }
        }</script>

        </head>
        <table>
        <tr><td valign='top'><b>NEED DELETE ROW WITH CHECKBOX FUNCTION:</td></tr>
        </table>
        <table id="dataTable" width="auto" style="margin:-4px 0 0 0; padding:14px 0 0 0;" cellspacing="10px"><tbody id="dataTable"></tbody>
        <tr>
        <td valign='Top'>
        &#x2717;
        <div id="div1">
        <input type="checkbox" name="chk[]" autocomplete="off" id="1" >
        </div>
        </td>

        <td valign='Top'>
        cars
        <div id="div2">
        <input type="text" name="car[]" id="2" >
        </div>
        </td>

        <td valign='Top'>
        trucks
        <div id="div3">
        <input type="text" name="truck[]" id="3" >
        </div>
        </td>

        <td valign='Top'>
        your favorite model
        <div id="div4">
        <textarea name="mod[]" id="4" rows="3" cols="20"></textarea>
        </div>
        <br><br>
        </td>

        <td valign='Top'>
        your favorite add-ons 
        <div id="div5">
        <textarea name="fav_col" id="5" rows="3" cols="20"></textarea> 
        </div>
        </td>

        <td valign='Top'>
        explain vehicle overall
        <div id="div6">
        <textarea name="fav_det" id="6" rows="3" cols="20"></textarea> 
        </div>
        </td>
        </tr>
        </table>
        <input type="button" value="Add another" onClick="addTextArea();" />&nbsp;
        <input type="button" value="Delete row" onclick="deleteRow('dataTable');deleteRowS('dataTable')" />

[LesF]

Did you solve your row deletion? As a quick memory test I threw this together:

<table border='1' id='TheTable'>
    <thead><th>..</th><th>Article</th></thead>
</table>
<input type='button' onclick='AddRow()' value='Add Article' />
&nbsp;
<input type='button' onclick='DeleteSelected()' value='Delete Selected' />

and script:

articleCount = 0;
function AddRow()
{
    var tb = document.getElementById('TheTable');
    var tbCount = tb.rows.length;
    var row = tb.insertRow(tbCount);
    var td1 = row.insertCell(0);
    var chk = document.createElement('input');

    articleCount++;
    chk.type = 'checkbox';
    chk.id = 'check_' + articleCount;
    td1.appendChild(chk);
    row.appendChild(td1);
    var td2 = row.insertCell(1);
    var spn = document.createElement('span');
    spn.innerHTML = "Article-" + articleCount;
    td2.appendChild(spn);
}
function DeleteSelected()
{
    var tb = document.getElementById('TheTable');
    var tbCount = tb.rows.length;
    for(var idx = tbCount -1; idx >= 0; idx--)
    {
        var row = tb.rows[idx];
        var chk = row.cells[0].childNodes[0];
        if (chk != null && chk.checked)
            tb.deleteRow(idx);
    }
}