title: Dynamically adding a column in html table through javascript
body: <p>I'm  writing a java script code that will dynamically append a column of checkbox in an already existed table in html. </p>
  
  <p>My html code goes like this:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;style&gt;
              table, td {
              border: 1px solid black;
              }
          &lt;/style&gt;
          &lt;title&gt;PHP MyAdmin&lt;/title&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;table border="1"&gt;
              &lt;tr&gt;
                  &lt;th&gt;Email_id&lt;/th&gt;
                  &lt;th&gt;Email_content&lt;/th&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td&gt;akshay1234530@yahoo.com&lt;/td&gt;
                  &lt;td&gt;bla bla&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td&gt;ohm3966@gmail.com&lt;/td&gt;
                  &lt;td&gt;bla bla&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/table&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And the javascript code that I'm writing to add column of checkboxes to this table created in html dynamically is as follows:</p>
  
  <pre><code>tbl = document.getElementsByTagName("body")[0];
  tr = tbl.getElementsByTagName("tr");
  
  for (i = 1; i &lt; tr.length; i++) {
      tr.appendChild(document.createElement('td'));
      var checkbox = document.createElement("INPUT");
      checkbox.type = "checkbox";
      tr.cells[2].appendChild(checkbox);
      tbl.appendChild(tr);
  }
  </code></pre>
  
  <p>I also want to specify an on click method on these checkboxes . Thanks in advance</p>