How to get totall count of checkbox value

HTML

<div class="form-check">
         <input class="form-check-input" type="checkbox" id="check-0" value="20">
         <label class="form-check-label" for="check-0">
            5GB Storage Space ($20)
         </label>
      </div>
                  <div class="form-check">
         <input class="form-check-input" type="checkbox" id="check-1" value="30">
         <label class="form-check-label" for="check-1">
            20GB Monthly Bandwidth ($30)
         </label>
      </div>
                  <div class="form-check">
         <input class="form-check-input" type="checkbox" id="check-2" value="40">
         <label class="form-check-label" for="check-2">
            My SQL Databases ($40)
         </label>
      </div>
                  <div class="form-check">
         <input class="form-check-input" type="checkbox" id="check-3" value="10">
         <label class="form-check-label" for="check-3">
            100 Email Account ($10)
         </label>
      </div>
                  <div class="form-check">
         <input class="form-check-input" type="checkbox" id="check-4" value="50">
         <label class="form-check-label" for="check-4">
            10 Free Domain Names ($50)
         </label>
      </div>

jQuery

    // Pricing Plan
    $('.package-btn li').on('click',function() {
        $(this).addClass('active').siblings().removeClass('active');
    });

    $('.form-check input').on('change', function() {
        var total = 0;
        $('input:checkbox:checked').each(function(){
            total += isNaN(parseInt($(this).val())) ? 0 : parseInt($(this).val());
        });

        $('.totalPrice').text(total);
    });
Share: