title: Create an array of objects by iterating through table rows
body: <p>I have an HTML table and I want to iterate through its rows and create a collection or lets say an "array of objects".</p>
  
  <p>For example:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;table id="tbPermission"&gt;
    &lt;tr&gt;
      &lt;th&gt;User ID&lt;/th&gt;
      &lt;th&gt;User Name&lt;/th&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
      &lt;td&gt;1&lt;/td&gt;
      &lt;td&gt;Test1&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I want to create a collection as below:</p>
  
  <pre><code>var trArray = [];
  $('#tbPermission tr').each(function () {
      var tdArray = [];
      $(this).find('td').each(function () {
  
          // I want to create the array of objects here …
          tdArray.push();
      });
  
      // Final array
      trArray.push(tdArray);
  });
  </code></pre>
  
  <p>The arrays may be like below:</p>
  
  <pre><code>tdArray : {'UserID' : '1', 'UserName' : 'Test1'};
  </code></pre>
  
  <p>and:</p>
  
  <pre><code>trArray : [
      {'UserID' : '1', 'UserName' : 'Test1'},
      {'UserID' : '2', 'UserName' : 'Test2'}
  ]
  </code></pre>