title: How to make Javascript dynamic html table and events on them
body: <p>I know how to create a table &amp; rows dynamically with DOM but don't able to figure out the onkeyup or onblur event in input type text, please find below my complete code, moreover it can be possible that another separate function is called on keyup in DOM? if so then how?</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 cell1 = row.insertCell(0);
              var element1 = document.createElement("input");
              element1.type = "checkbox";
              cell1.appendChild(element1);
  
              var cell2 = row.insertCell(1);
              cell2.innerHTML = rowCount + 1;
  
  
              var cell3 = row.insertCell(2);
              var element2 = document.createElement("input");
              element2.type = "text";
              cell3.appendChild(element2);
              cell3.keyup="alert(asdf)";
  
  
          }
  
          function deleteRow(tableID) {           
              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(null != chkbox &amp;&amp; true == chkbox.checked) {
                      table.deleteRow(i);
                      rowCount--;
                      i--;
                  }
  
  
              }
  
          }
  
      &lt;/SCRIPT&gt;
  &lt;/HEAD&gt;
  &lt;BODY&gt;
  
      &lt;INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /&gt;
  
      &lt;INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" /&gt;
  
      &lt;TABLE id="dataTable" width="350px" border="1"&gt;
          &lt;TR&gt;
              &lt;TD&gt;&lt;INPUT type="checkbox" name="chk"/&gt;&lt;/TD&gt;
              &lt;TD&gt; 1 &lt;/TD&gt;
              &lt;TD&gt; &lt;INPUT type="text" /&gt; &lt;/TD&gt;
          &lt;/TR&gt;
      &lt;/TABLE&gt;
  
  &lt;/BODY&gt;
  &lt;/HTML&gt;
  </code></pre>