JSFiddle - React, Tailwind, and code Playground

by darkajax

HTML

<label><input type="checkbox" class="checkbox" checked><span class="numbers">42</span></label><br />
<label><input type="checkbox" class="checkbox" checked><span class="numbers">13</span></label><br />
<label><input type="checkbox" class="checkbox" checked><span class="numbers">100</span></label><br />

<br /><br />
<span class="total"></span>

JavaScript

var sum = 0;
$('.numbers').each(function() {
    sum += parseInt($.text(this), 10);
});

$(".total").text(sum);


$('.checkbox').change(function () {
       //assign
       var sumChange = 0;    
    
      //for each checked checkbox
      $('.checkbox:checked').each(function () {
          $(this).next('.numbers').each(function() {
              sumChange += parseInt($.text(this), 10);
          });
      });
        
       $(".total").text(sumChange);

  });