title: How to add a checkbox dynamically to each row before adding it to a table
body: <p>I am adding rows of Jquery datatable to a table .</p>
  
  <p>My requirement is that i want to add a checkbox before each row .</p>
  
  <p>I have tried as </p>
  
  <pre><code>$(this).append('&lt;input type="checkbox"/&gt;');            
              $("#greaterquan").append(this.outerHTML);
  </code></pre>
  
  <p>But this is not working .</p>
  
  <p><a href="http://jsfiddle.net/b4j852uq/11/" rel="nofollow">http://jsfiddle.net/b4j852uq/11/</a></p>
  
  <p>THis is my code</p>
  
  <pre><code>    &lt;table id="allwl"&gt;
          &lt;th class="hidden-480"&gt;Price&lt;/th&gt;
          &lt;th class="hidden-480"&gt;Volume&lt;/th&gt;
          &lt;th class="hidden-480"&gt;Quantity&lt;/th&gt;
      &lt;/table&gt;
  
  
  
  
      &lt;div id="greaterquan"&gt;
          &lt;h3&gt;My Stocks&lt;/h3&gt;
      &lt;/div&gt;
  
  
  
  var dataSet = [
      [
          "1441.75",
          "34444444"],
      [
          "1614.45",
          "34444444"
  
      ],
      [
          "834.15",
          "233333"]
  
  ];
  
  var array_names = ["APPLE", "WHIRLPOOL", "SAMSUNG"];
  
  for (var key in dataSet) {
      if (dataSet.hasOwnProperty(key)) {
          dataSet[key].splice(0, 0, array_names[key]);
      }
  }
  
  $(function () {
      $('#allwl').dataTable({
          "iDisplayLength": -1,
              "data": dataSet,
              "columns": [{
              "title": "Name"
          }, {
              "title": "Price"
          }, {
              "title": "Quantity"
          }]
      });
  });
  $(document).ready(function(){
  $('#allwl tr').each(function() {
      var abc = $(this).children('td').eq(2).html();
          if(abc &gt; 40000) {
              $(this).children('td').eq(0).css('background-color', 'green');
  //$(this).append('&lt;input type="checkbox"/&gt;');            
              $("#greaterquan").append(this.outerHTML);
          }
  
  });
  });
  </code></pre>