Как высчитать сумму второго столбца, куда заносятся цифры из первого, но так чтобы в этой сумме учитывалось и удаление этих цифр при повторном клике?

Question

[Александр Тимофеев]

Пример такой: jsfiddle.net/timofeev/pawcx686
Плюс ещё не пойму, почему сумма высвечивается только после кликав по всем ячейкам. Нужно чтобы и при одной сумма была.

<table id="tbl">
  <tr>
      <td>5</td><td style='display:none'></td>
  </tr>
  <tr>
    <td>7</td><td style='display:none'></td>
  </tr>
  <tr>
    <td>4</td><td style='display:none'></td>
  </tr>
 </table>
<div id="res" style="font-weight:bold"></div>

$('#tbl tr:eq(0) td:eq(0)').on('click', function(){
    var i = $(this).text();
    $('#tbl tr:eq(0) td:eq(1)').text(i).toggle();
     
        
    var sum = 0;
      $('#tbl td:nth-child(2)').each(function(){
          sum+=parseInt($(this).text());
      });
      $('#res').html(sum);
});
$('#tbl tr:eq(1) td:eq(0)').on('click', function(){
    var i = $(this).text();
    $('#tbl tr:eq(1) td:eq(1)').text(i).toggle();
    
        var sum = 0;
      $('#tbl td:nth-child(2)').each(function(){
          sum+=parseInt($(this).text());
      });
      $('#res').html(sum);
});
$('#tbl tr:eq(2) td:eq(0)').on('click', function(){
    var i = $(this).text();
    $('#tbl tr:eq(2) td:eq(1)').text(i).toggle();
    
        var sum = 0;
      $('#tbl td:nth-child(2)').each(function(){
          sum+=parseInt($(this).text());
      });
      $('#res').html(sum);
});

Answer 1

[Ivan Demidov]

Форкнул jsfiddle.net/pawcx686/1