title: SUM Total for Column
body: <p>please refer to previous question here: <a href="https://stackoverflow.com/questions/10802244/sum-total-for-column-in-jquery">Sum total for column in jQuery</a></p>
  
  <p>i used Aymen's solution, but i edited it to suite my need. It stopped working, my code as below as seen at jsfiddle: <a href="http://jsfiddle.net/unKDk/15/" rel="nofollow noreferrer">http://jsfiddle.net/unKDk/15/</a></p>
  
  <pre><code>&lt;table id="sum_table" width="300" border="1"&gt;
      &lt;tr class="titlerow"&gt;
          &lt;td&gt;Apple&lt;/td&gt;
          &lt;td&gt;Orange&lt;/td&gt;
          &lt;td&gt;Watermelon&lt;/td&gt;
          &lt;td&gt;Strawberry&lt;/td&gt;
          &lt;td&gt;Total By Row&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td class="rowAA"&gt;1&lt;/td&gt;
          &lt;td class="rowAA"&gt;2&lt;/td&gt;
          &lt;td class="rowBB"&gt;3&lt;/td&gt;
          &lt;td class="rowBB"&gt;4&lt;/td&gt;
          &lt;td class="totalRow"&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td class="rowAA"&gt;1&lt;/td&gt;
          &lt;td class="rowAA"&gt;2&lt;/td&gt;
          &lt;td class="rowBB"&gt;3&lt;/td&gt;
          &lt;td class="rowBB"&gt;4&lt;/td&gt;
          &lt;td class="totalRow"&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td class="rowAA"&gt;1&lt;/td&gt;
          &lt;td class="rowAA"&gt;5&lt;/td&gt;
          &lt;td class="rowBB"&gt;3&lt;/td&gt;
          &lt;td class="rowBB"&gt;4&lt;/td&gt;
          &lt;td class="totalRow"&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr class="totalColumn"&gt;
          &lt;td class="totalCol"&gt;Total:&lt;/td&gt;
          &lt;td class="totalCol"&gt;Total:&lt;/td&gt;
          &lt;td class="totalCol"&gt;Total:&lt;/td&gt;
          &lt;td class="totalCol"&gt;Total:&lt;/td&gt;
          &lt;td class="totalCol"&gt;Total:&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Jquery part is</p>
  
  <pre><code>var totals=[0,0,0,0,0];
  $(document).ready(function(){
  
      var $dataRows=$("#sum_table tr:not('.totalColumn, .titlerow')");
  
      $dataRows.each(function() {
          $(this).find('.rowAA').each(function(i){        
              totals[i]+=parseInt( $(this).html());
          });
  
          $(this).find('.rowBB').each(function(i){        
              totals[i]+=parseInt( $(this).html());
          });        
      });
      $("#sum_table td.totalCol").each(function(i){  
          $(this).html("total:"+totals[i]);
      });
  
  });
  </code></pre>
  
  <ol>
  <li>how to solve the problem that caused the jquery calculate wrongly.</li>
  <li>how to calculate total by row</li>
  <li>i need the class name exactly same.</li>
  </ol>