title: How to read value of check box inside html table which was inserted dynamically into the table cell as inner html?
body: <p>I have added multiple check boxes (using "for" loop which is omitted in code section for easy understanding) into each row of a html table dynamically using Java script. The code goes like this,</p>
  
  <pre><code>var table = document.getElementById("verifyTable");
  var row = table.insertRow(1);
  var cell1 = row.insertCell(0);
  cell1.innerHTML = "&lt;input type='checkbox' class = 'checkSensors' id='checkSensorsId' value=''&gt;";
  </code></pre>
  
  <p>Then at run time when the check box is checked/unchecked an event is fired using JQuery like this,</p>
  
  <pre><code>$(document).on('change', '[type=checkbox]', function() {
      $("table tr td:nth-child(1)").each(function () {
          var checkbox = $(this).html();
          alert(checkbox);
      });
  });
  </code></pre>
  
  <p>Unfortunately the inner html text <code>&lt;input type='checkbox' class = 'checkSensors' id='checkSensorsId' value=''&gt;</code> is what I receive as output. I can't figure out a way on how to get the value of innerhtml "input" element. Please help me solve this.</p>