Calculating the Sum inside a table using Jquery

Here is one sample code to sum the column values using jquery.

HTML:

<tr>

<td>Number</td>

</tr>

<tr>

<td>Number</td>

</tr>

<tr>

<td>Number</td>

</tr>

Sum :

</td>

</tr>

</table>

jQuery:

</script>

$(document).ready(function() {

//iterate through each textboxes and add keyup

//handler to trigger sum event

$(".txt").each(function() {

$(this).keyup(function() {

calculateSum();

});

function calculateSum() {

var sum = 0;

//iterate through each textboxes and add the values

$(".txt").each(function() {

//add only if the value is number

if (!isNaN(this.value) && this.value.length != 0) {

sum += parseFloat(this.value);

$(this).css("background-color", "#FEFFB0");

}

else if (this.value.length != 0){

$(this).css("background-color", "red");

}

});

$("#sum").html(sum.toFixed(2));

}

</script>

Download the working sample and give a try!!