title: Deleting a table row from button click
body: <p>The following code that I typed is used to add or delete rows in an html table. When I click the add button without any problem, but when I click the delete button though I want to delete a particular row I am unable to. I get an alert message stating:</p>
  
  <blockquote>
    <p>"can not read property `onclick` of null "</p>
  </blockquote>
  
  <p>How can I rectify this issue?</p>
  
  <pre><code>&lt;HTML&gt;
    &lt;HEAD&gt;
      &lt;TITLE&gt; Add/Remove dynamic rows in HTML table &lt;/TITLE&gt;
      &lt;SCRIPT language="javascript"&gt;
        function addRow(tableID) {
  
          var table = document.getElementById(tableID);
  
          var rowCount = table.rows.length;
          var row = table.insertRow(rowCount);
  
          var colCount = table.rows[0].cells.length;
  
          for (var i = 0; i &lt; colCount; i++) {
  
            var newcell = row.insertCell(i);
  
            newcell.innerHTML = table.rows[0].cells[i].innerHTML;
            //alert(newcell.childNodes);
            switch (newcell.childNodes[0].type) {
              case "text":
                newcell.childNodes[0].value = "";
                break;
              case "checkbox":
                newcell.childNodes[0].checked = false;
                break;
              case "select-one":
                newcell.childNodes[0].selectedIndex = 0;
                break;
            }
          }
        }
  
        function deleteRow(tableID) {
          try {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;
  
            for (var i = 0; i &lt; rowCount; i++) {
              var row = table.rows[i];
              var chkbox = row.cells[0].childNodes[0];
              if (document.getElementById('button').onclick == true) {
                if (rowCount &lt;= 1) {
                  alert("Cannot delete all the rows.");
                  break;
                }
                table.deleteRow(i);
                rowCount--;
                i--;
              }
  
  
            }
          } catch (e) {
            alert(e);
          }
        }
      &lt;/SCRIPT&gt;
    &lt;/HEAD&gt;
  
    &lt;BODY&gt;
      &lt;INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /&gt;
  
      &lt;TABLE id="dataTable" width="350px" border="1"&gt;
        &lt;TR&gt;
  
          &lt;TD&gt;
            &lt;INPUT type="button" name="button" value=delete id=delete onclick="deleteRow('dataTable')"&gt;
          &lt;/TD&gt;
  
        &lt;/TR&gt;
      &lt;/TABLE&gt;
    &lt;/BODY&gt;
  &lt;/HTML&gt;
  </code></pre>