title: How do I add 'x' number of <td> elements into a <tr> element in a for loop? [jQuery]
body: <p>I am trying to make a square table dynamically through jQuery</p>
  
  <p>My code so far is</p>
  
  <pre><code>$(document).ready(function() {
    $('body').append('&lt;table&gt;&lt;/table&gt;');
    initial();
  });
  
  var input = 16
  
  function initial () {
    for (i = 0; i &lt; input; i++) {
      $('table').append('&lt;tr&gt;&lt;/tr&gt;');
      $('tr').append('&lt;td&gt;&lt;/td&gt;');
    }
  }
  </code></pre>
  
  <p>What I am trying to do is if I add 16 table row elements, then 16 table data elements will be added to each one, effectively creating a 16x16 grid</p>
  
  <p>My current code only creates half of the table
  I have to do this through jQuery</p>
  
  <p>Sorry if it's simple, but I'm a bit daft</p>
  
  <p>Thanks</p>