title: Need to target an element through jQuery please <3
body: <p>I'm trying to get the add to cart button to change the price down below, there will be multiple products and they all need to add up the total price. I've written out the jQuery but having some issues targeting the price to put into the cart. </p>
  
  <p>Any help would be appreciated!</p>
  
  <p><a href="https://codepen.io/anon/pen/adOXjM" rel="nofollow">https://codepen.io/anon/pen/adOXjM</a></p>
  
  <p>HTML of product:</p>
  
  <pre><code>&lt;div class="product"&gt;
      &lt;div class="product-img"&gt;
          &lt;img src="http://cdn-images.farfetch.com/11/12/88/52/11128852_5407427_1000.jpg"&gt;
      &lt;/div&gt;
      &lt;div class="product-actions"&gt;
          &lt;div class="price"&gt;
              $&lt;span&gt;97&lt;/span&gt;
          &lt;/div&gt;
          &lt;button class="add-to-cart"&gt;Add to Cart&lt;/button&gt;
          &lt;span class="add-product"&gt;+&lt;/span&gt;
          &lt;span class="minus-product"&gt;-&lt;/span&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>var price = 0;
  $('add-to-cart').click(function(){
      $(this).toggleClass('highlight');
      if($(this).hasClass('highlight')){
        price += parseInt($(this).parent().child().find('.price &gt; span').text());
      }else{
         price -=  parseInt($(this).parent().find('.price &gt; span').text());
      }
      $('.shopping-cart &gt; span').text(price);
  });
  </code></pre>
  
  <p>codepen will give all the details and clear view.</p>
  
  <p>Thank you kindly!</p>