Show every total div in one div with every new action in jquery

Question

Javascript Code:

$(document).on('click', '#google_analytics', function() {
    if ($("#google_analytics").prop('checked') == true) {
        var google_analytics_cost = $('#google_analytics_cost').val();
        $('.total-amount12').text(google_analytics_cost);
    } else {
        $('.total-amount12').text('0');
    }
});

$(document).on('click', '#mailing_list', function() {
    if ($("#mailing_list").prop('checked') == true) {
        var mailing_cost = $('#mailing_list_cost').val();
        $('.total-amount13').text(mailing_cost);
    } else {
        $('.total-amount13').text('0');
    }
});

I just want to add both total actions to one div. What is called total-amt <div class="total-amt">0</div> In this div, every time I click on an action, the total value should show the div total-amt , and then if I click on another action, then its total amount is too added with the previous amount.

Answer 1

, , div, integer (parseInt), newValue. , div.

Edit-1

$ div. .

//Action performed and Add the sum to that div
$('a').click(function(){
  //New value that is going to add into div
  var newValueToAdd = 10;
  //Replace the HTML with final summation
  $('.total-amt')
    .html("$" + 
          (parseInt($('.total-amt').html().replace('$', '')) + 
          newValueToAdd));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="total-amt">$0</div>
<a href="javascript:void(0)">Add</a>

Hide result