Here is my HTML - 

```
    <!DOCTYPE html>
 <html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Register for Full Stack Conf</title>
  <link href='https://fonts.googleapis.com/css?family=Roboto:400,500,700' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div class="container">

    <header>
      <span>Register for</span>
      <h1>Full Stack Conf</h1>
    </header>

    <form action="index.html" method="post">

      <fieldset>         
        <legend>Basic Info</legend>

        <label for="name">Name:</label>
        <input type="text" id="name" name="user_name">

        <label for="mail">Email:</label>
        <input type="email" id="mail" name="user_email">

        <label>Job Role</label>
        <select id="title" name="user_title">
          <option value="full-stack js developer">Full Stack JavaScript       Developer</option>
          <option value="front-end developer">Front End Developer</option>
          <option value="back-end developer">Back End Developer</option>
          <option value="designer">Designer</option>          
          <option value="student">Student</option>
          <option value="other">Other</option>  
        </select>           
      </fieldset>

      <fieldset class="shirt">
        <legend>T-Shirt Info</legend>

        <div>
          <label for="size">Size:</label>
          <select id="size" name="user_size">
            <option value="small">S</option>
            <option value="medium" selected>M</option>
            <option value="large">L</option>
            <option value="extra large">XL</option>
          </select>
        </div>

        <div>
          <label for="design">Design:</label>
          <select id="design" name="user_design">
            <option>Select Theme</option>
            <option value="js puns">Theme - JS Puns</option>
            <option value="heart js">Theme - I &#9829; JS</option>
          </select>
        </div>

        <div id="colors-js-puns" class="">
          <label for="color">Color:</label>
          <select id="color">
            <option value="cornflowerblue">Cornflower Blue (JS Puns shirt only)</option>
            <option value="darkslategrey">Dark Slate Grey (JS Puns shirt only)</option> 
            <option value="gold">Gold (JS Puns shirt only)</option> 
            <option value="tomato">Tomato (I &#9829; JS shirt only)</option>
            <option value="steelblue">Steel Blue (I &#9829; JS shirt only)</option> 
            <option value="dimgrey">Dim Grey (I &#9829; JS shirt only)</option> 
          </select>
        </div>                
      </fieldset>

      <fieldset class="activities">
        <legend>Register for Activities</legend>
        <label><input type="checkbox" name="all"> Main Conference — $200</label>
        <label><input type="checkbox" name="js-frameworks"> JavaScript Frameworks Workshop — Tuesday 9am-12pm, $100</label>
        <label><input type="checkbox" name="js-libs"> JavaScript Libraries Workshop — Tuesday 1pm-4pm, $100</label>
        <label><input type="checkbox" name="express"> Express Workshop — Tuesday 9am-12pm, $100</label>
        <label><input type="checkbox" name="node"> Node.js Workshop — Tuesday 1pm-4pm, $100</label>          
        <label><input type="checkbox" name="build-tools"> Build tools Workshop — Wednesday 9am-12pm, $100</label>
        <label><input type="checkbox" name="npm"> npm Workshop — Wednesday 1pm-4pm, $100</label>

      </fieldset>
      <fieldset>
        <legend>Payment Info</legend>

        <label for="payment">I'm going to pay with:</label>
        <select id="payment" name="user_payment">
          <option value="select_method">Select Payment Method</option>
          <option value="credit card">Credit Card</option>
          <option value="paypal">PayPal</option>
          <option value="bitcoin">Bitcoin</option>
        </select>

        <div id="credit-card" class="credit-card">

          <div class="col-6 col">
            <label for="cc-num">Card Number:</label>
              <input id="cc-num" name="user_cc-num" type="text">
          </div>

          <div class="col-3 col">
            <label for="zip">Zip Code:</label>
            <input id="zip" name="user_zip" type="text"> 
          </div>

          <div class="col-3 col">
            <label for="cvv">CVV:</label>
            <input id="cvv" name="user_cvv" type="text"> 
          </div>

          <label>Expiration Date:</label>
          <select id="exp-month" name="user_exp-month">
            <option value="1">1 - January</option>
            <option value="2">2 - February</option>
            <option value="3">3 - March</option>
            <option value="4">4 - April</option>
            <option value="5">5 - May</option>
            <option value="6">6 - June</option>
            <option value="7">7 - July</option>
            <option value="8">8 - August</option>
            <option value="9">9 - September</option>
            <option value="10">10 - October</option>
            <option value="11">11 - November</option>   
            <option value="12">12 - December</option>                         
          </select>  
          <select id="exp-year" name="user_exp-year">
            <option value="2016">2016</option>
            <option value="2017">2017</option>
            <option value="2018">2018</option>
            <option value="2019">2019</option>
            <option value="2020">2020</option>                        
          </select>                                  
        </div>

        <div>
            <p>If you selected the PayPal option we'll take you to Paypal's site to set up your billing information, when you click “Register” below.</p>
        </div> 

        <div>
            <p>If you selected the Bitcoin option we'll take you to the Coinbase site to set up your billing information. Due to the nature of exchanging Bitcoin, all Bitcoin transactions will be final.</p>
        </div>                  

      </fieldset>        

      <button type="submit">Register</button>

    </form>

    </div>
</body>
<script src="js/main.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="js/jquery.js"></script>
</html>

```

The "activities" class has the activities listed and their dollar values. I already tried creating a total dollars variable and += how much $ to the variable once an input name was checked, but I did it based on "is :checked inside an on change function that applied to the whole list, so if something was checked and you checked something else it re-added the first thing that was already checked's money value, so if the first class was checked it showed 100, then you clicked another one and it went to 300 , adding the first class again.

Here is my jquery

```
$(document).ready(function() {
//append the total dollars display under activities and hide it until clicked
var $TotalDollars = 0;
var $TotalDollarsDisplay = $('<div></div>');
$('.activities').append($TotalDollarsDisplay);
$($TotalDollarsDisplay).hide();
//checkbox needs to show unique dates and times and disable duplicates
$(".activities").find("input:checkbox").change(function() {
//variables for activity input names
    var $jsFrameworks = $("input[name='js-frameworks']");
    var $Express = $("input[name='express']");
    var $jsLibs = $("input[name='js-libs']");
    var $Node = $("input[name='node']");
    var $MainConf = $("input[name='all']");
    var $Npm = $("input[name='npm']");
    var $BuildTools = $("input[name='build-tools']");
    var $CheckedActivities = $(".activities").find('input:checkbox:checked').length;
    console.log($CheckedActivities);
//Disable duplicate times scheduled
        if (($jsFrameworks).is(':checked')) {
            ($Express).prop('disabled', true);
        } else  {
            ($Express).prop('disabled', false);
        } 
        if (($Express).is(':checked')) { 
            ($jsFrameworks).prop('disabled', true);
        } else {
            ($jsFrameworks).prop('disabled', false);
        }
        if (($jsLibs).is(':checked')) {
            ($Node).prop('disabled', true);
        } else  {
            ($Node).prop('disabled', false);
        } 

        if (($Node).is(':checked')) { 
            ($jsLibs).prop('disabled', true);
        } else {
            ($jsLibs).prop('disabled', false);
        }
//add up the total dollars for each activity
    //Adding the non duplicate workshops to the total
    });

});

```

Can someone give me some insight how to do this, also where the total is only showing below the checkboxes if at least one is checked.