Totaling columns on a variable input html table

I have a table that has variable input fields of data that are brought up when specific data is searched, ultimately it is the view of cash registers and their amount of cash and credit that has been pulled throughout the day. I really need to be able to total the data that is brought up each time a search is preformed, this would be the total of the columns. Also I need to find the difference in each row. (Sometimes that amount of cash that should be in each drawer is not exactly what each cashier actually puts in the drawer, usually there is a couple cents difference.)So I need to calculate that also. If you go to this link you will see exactly what my table looks like and what I am trying to do. http://64.92.143.227/monee/cash.html I have tried multiple javascript codes from this site and I cant seem to get any to work. I am new at javascript so any help would be great! Thank you!

Here is the code for the table:

               <tr>
               <th> </th>
               <th>STATUS </th>
               <th>QTY </th>
               <th>COUNT </th>

               <th>+/- </th>

            </tr>
                     <tr><td>CASH </td><td>
                              <div class="tleft"></div>
                              <input style="width: 100px;height: 17px;" id="cash_in"  value=""/>
                              </td>
                              <td>
                              <div class="tleft"><input style="width: 100px;height: 17px;"
     id="no_cash"  value=""/></div>
                              </td>

                              <td>
                              <div class="tleft"><input style="width: 100px;height: 17px;"
 id="cash_count" value=""/></div>
                              </td>
                              <td>
                              <div class="tleft"><input style="width: 100px;height: 17px;" 
id="ttl_cash" value=""/></div>
                              </td></tr>
                     <tr><td>CHECK </td><td>
                              <div class="tleft"></div>

                             <input style="width: 100px;height: 17px;" id="check_in" value=""/>

                             </td>
                              <td>
                              <div class="tleft"><input style="width: 100px;height:  
17px;"id="no_checks " value=""/></div>
                              </td>
                              <td>
                              <div class="tleft"><input style="width: 100px;height: 17px;" 
id="check_count" value=""/></div>
                              </td>

                              <td>
                              <div class="tleft"><input style="width: 100px;height: 17px;" 
id="ttl_check" value=""/></div>

                          </td>
                          </tr>
                 <tr><td>CHARGE </td><td>
                          <div class="tleft"></div><input style="width: 100px;height: 17px;" id="credit_in" value="" OnTextChanged="javascript:calc()"/>
                          </td>
                          <td>

                          <div class="tleft"><input style="width: 100px;height: 17px;" id="no_charge" value=""/></div>
                          </td>

                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="charge_count" value=""/></div>
                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="ttl_charge" value=""/></div>
                          </td>

                          </tr>
                 <tr><td>ACCOUNT </td><td>

                          <div class="tleft"><input style="width: 100px;height: 17px;" id="voucher_in" value=""/></div>
                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="no_voucher" value=""/></div>
                          </td>
                          <td>

                          <div class="tleft"><input style="width: 100px;height: 17px;" id="voucher_count" value=""/></div>
                          </td>
                          <td>

                          <div class="tleft"><input style="width: 100px;height: 17px;" id="ttl_account" value=""/></div>
                          </td>
                          </tr>
                 <tr><td>GIFT CERT </td><td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="tender6_in" value=""/></div>

                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="no_tender6" value=""/></div>

                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="tender6_count" value=""/></div>
                          </td>
                          <td>

                          <div class="tleft"><input style="width: 100px;height: 17px;" id="ttl_giftcert" value=""/></div>
                          </td>
                          </tr>
                 <tr>&开发者_运维技巧lt;td>BUYBACK </td><td>

                          <div class="tleft"><input style="width: 100px;height: 17px;" id="buyback_in" value=""/></div>
                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="no_buyback" value=""/></div>

                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="buyback_count" value=""/></div>
                          </td>
                          <td>

                          <div class="tleft"><input style="width: 100px;height: 17px;" id="ttl_buyback" value=""/></div>
                          </td>
                          </tr>

                 <tr><td>CASH CARD </td><td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="csh_card_in" value=""/></div>
                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="no_csh_card" value=""/></div>

                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="csh_card_count" value=""/></div>

                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="ttl_csh_card" value=""/></div>
                          </td>
                          </tr>
                 <tr><td>TOTAL </td><td>

                          <div class="tleft"></div>
                         <input style="width: 100px;height: 17px;" id="ttl_status;" value=""/>

                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="ttl_qty" value=""/></div>
                          </td>
                          <td>
                          <div class="tleft"><input style="width: 100px;height: 17px;" id="ttl_count" value=""/></div>
                          </td>
                          <td>

                          <div class="tleft"><input style="width: 100px;height: 17px;" id="ttl_ttl" value=""/></div>
                          </td>
                          </tr>
                       </table>

Edit

The code below just sums each colulmn, I see now that you want to do more than that. You should be able to adjust the code to do what you want. Some example data and calculations would help.

Original

You can use the index of the cells to add them up, e.g.

var totalTable = (function() {

  // Specific functions so keep private
  function getCellValue(cell) {
    var input = cell.getElementsByTagName('input')[0];
    return input && +input.value || 0;
  }

  function setCellValue(cell, value) {
    var input = cell.getElementsByTagName('input')[0];
    input.value = value;
  }

  return function (id) {
    var table = document.getElementById(id)
    if (!table) return;

    var rows = table.rows;
    var sums = [];
    var cell, cells;

    // Initialise sums
    var i = rows[0].cells.length;
    while (i--) sums[i] = 0;

    // Skip the first and and last rows
    for (var i=1, iLen=rows.length - 1; i<iLen; i++) {
      cells = rows[i].cells;

      for (var j=1, jLen=cells.length; j<jLen; j++) {
        sums[j] += getCellValue(cells[j]);
      }
    }

    // Put totals in the last row
    cells = rows[i].cells;
    j = cells.length;

    while (--j) {
      setCellValue(cells[j], sums[j]);
    }
  }
}());

Note that you may want to do some formatting of the sums (do that last when writing the values out) and also validate the values of the cells (do that in the getCellValue function)

Mark each td of the table with its column number using a class. For example:

<tr>
    <td class="col1"> ... </td>
    <td class="col2"> ... </td>
    <td class="col3"> ... </td>
</tr>

Using these column classes you can enumerate vertically much more easily. Here's an example of building a "total" value for the first column whenever an input is changed:

$(document).ready(function() {
    var col1_inputs = $('td.col1 input');
    var col1_total = $('td#col1_total input');

    col1_inputs.change(function() {
        var total = 0;

        col1_inputs.each(function(idx, el) {
            var cell_value = parseInt(el.value, 10);

            if ( !isNaN(cell_value) )
                total += cell_value;
        });

        col1_total.val(total);
    });
});

jsFiddle