Question

I’m new to jQuery and busy with creating an graph based on a table. I found a nice example on: http://coding.smashingmagazine.com/2011/09/23/create-an-animated-bar-graph-with-html-css-and-jquery/

But my question is how to select a table and put them in an array?

    <table id="data-table" border="1" cellpadding="10" cellspacing="0">
      <caption>
        table
      </caption>
      <thead>
        <tr>
          <td>month</td>
          <th scope="col">usage 1</th>
          <th scope="col">usage 2</th>

        </tr>
      </thead>
      <tbody>
        <tr>
          <th scope="row">jan</th>
          <td>1</td>
          <td>2</td>
        </tr>
        <tr>
          <th scope="row">feb</th>
          <td>3</td>
          <td>4</td>
        </tr>
        <tr>
          <th scope="row">march</th>
          <td>5</td>
          <td>6</td>
        </tr>
                    <tr>
          <th scope="row">april</th>
          <td>7</td>
          <td>8</td>
        </tr>
                    <tr>
          <th scope="row">may</th>
          <td>9</td>
          <td>10</td>
        </tr>
      </tbody>
    </table>

If I’m looking into the tutorial, I see that it is selecting left to right and put them in two arrays.

    // Sort data into groups based on number of columns
    columnGroups: function() {
     var columnGroups = [];
   // Get number of columns from first row of table body
   var columns = data.find('tbody tr:eq(0) td').length;
   for (var i = 0; i < columns; i++) {
      columnGroups[i] = [];
      data.find('tbody tr').each(function() {
         columnGroups[i].push($(this).find('td').eq(i).text());
      });
   }
   return columnGroups;
}

How to get in 5 arrays , and value like 1,2 instead 1,3,5,7,9,

Answer 1

$(function(){
   var columnGroups = [],
       table = $('#data-table');

  table.find('tbody tr').each(function(index) {
     columnGroups[index] = [];
     $(this).find('td').each(function() {
         columnGroups[index].push($(this).text());
     });
  });

  console.log(columnGroups);
});

Demo: http://jsfiddle.net/tdmvt/