<table border="1">
  <tr class="row">
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td class="tdoutput"></td>

  </tr>

  <tr class="row">
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td class="tdoutput"></td>

  </tr>
</table>

.selectedCell{
  background-color:green;

}

$( function() {
  $('td').click( function() {
    $(this).toggleClass("selectedCell");
  } );
} );


function update_counts(){
    $('.tdoutput').html('');
    $('.row').each(function(index){
       $('.tdoutput').html($('.tdoutput').html() + $(this).find('.selectedCell').length + ' selected cells ');
    });
}

$('.td').click(function(){

    // Add or remove class
    $(this).toggleClass('selectedCell');

    // Update the class counts
    update_counts();

});

// Run the function on domready
$(function(){
    update_counts();
});