title: How to sum divs values?
body: <p>I have some divs that have values. I want to sum in one <code>&lt;h3&gt;</code>
  The probem in my code is that I get the last div value and cannot sum the other.</p>
  
  <p>Html code:</p>
  
  <pre><code>&lt;div class="cart-footer"&gt;
        &lt;div class="order-tools"&gt;
          &lt;h3 id="total"&gt;
  
          &lt;/h3&gt;
        &lt;/div&gt;
        &lt;div class="cash-out"&gt;
  
        &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Jquery:</p>
  
  <pre><code>var sum = 0;
  $('#item-total').each(function(){
   var val = $.trim($(this).text());
   if (val) {
   val = parseFloat(val.replace(/^\$/, ""));
   sum += !isNaN(val) ? val : 0;
   }
  });
  $("#total").html(sum + "$");
  </code></pre>
  
  <p>You can see <code>#item-total</code> in this code:</p>
  
  <pre><code>$(".cart-body").append(function(){
       return "&lt;div id='cart-list'&gt;&lt;div class='product-name'&gt;"+personObject.name+"&lt;/div&gt;&lt;div class='product-tools'&gt;&lt;input type='number' data-id='1' value='1' min='1'&gt;&lt;/input&gt;&lt;label id='price'&gt;Price: "+personObject.price+"&lt;/label&gt;&lt;label data-value='"+personObject.count * personObject.price+"' id='item-total'&gt;"+personObject.count * personObject.price+"&lt;/label&gt;&lt;/div&gt;&lt;/div&gt;";
     });
  </code></pre>