title: How to count td of single column with particular class with jQuery
body: <p>I've a html table, generated by code, of many rows and column.
  Some of this TD has a ON class to style it differently.</p>
  
  <p>The structure of table has an header, a body, and a footer row.</p>
  
  <p>I'd like to sum the quantity of all the TD with class 'ON' in each column and put the result on last row (footer) in each column.</p>
  
  <p>How can I do it?
  (the rows and column are not a 'fixed matrix', so I don't know in advance how many rows and columns has the table)</p>
  
  <p>Example table:</p>
  
  <pre><code>data       | id_1 | id_2 | id_3 | ...
  2012-06-20 | "ON" |      |      | ...
  2012-06-21 | "ON" |      |      | ...
  2012-06-22 | "ON" | "ON" |      | ...
  2012-06-23 | "ON" |      | "ON" | ...
  2012-06-24 | "ON" | "ON" |      | ...
  tot        |   5  |   2  |   1  | ...
  </code></pre>
  
  <p>UPDATE: mixing solutions of CRANIO and ALNITAK this is the result:</p>
  
  <pre><code>var a = [];
  $('td').each(function() {
  
      var n = $(this).index();
      if($(this).hasClass('on')){
         a[n] = a[n] ? a[n] + 1 : 1;
      }else{
         a[n] = a[n] ? a[n] : 0;
      }
  });
  
  var t = $('&lt;tr&gt;').appendTo('#tableID &gt; tfoot');
  $.each(a, function(i, n) {
      t.append($('&lt;td&gt;', { text: i === 0 ? 'total' : n }));
  });
  </code></pre>
  
  <p>In this way you add ZEROS (or empty space --->  a[n] = a[n] ? a[n] : ''; &lt;--- to columns without TD.on and resolve little bug if there are some empty cols on the end of table (in the elegant solution of alnitak the TD on last row were not added)</p>
  
  <p>P.S. useful also to create different total rows, on different TD.class, appending more TR based upon different class.</p>