Need a delete row with checkbox function onclick event button--DOM

[GOLDfeet]

I have a dynamic script and need to create a click event function with JavaScript to delete the row which has a checkbox checked when the delete button is pressed. 
 
 
This is being implemented with PHP and as now serves as light code for this matter at hand. I was only able to delete all rows. I have my efforts with the js functions too.

 

 

<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;
      // 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'>
   ✗
   <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();" /> 
   <input type="button" value="Delete row" onclick="deleteRow('dataTable');deleteRowS('dataTable')" />

[gristoi]

unless you are doing this to learn the fundimentals of javascript then STOP.  Firstly , use Jquery to listen to the click events. it is 2014, no one needs to write javascript  like this anymore