Price Calculator

HTML

<ul>
  <li>
    <input type="checkbox" class="option1" value="100" id="ItemA" />
    <label for="ItemA">Item A<span style="padding-left:108px;">100 €</span></label>
  </li>
  <li>
    <input type="checkbox" class="option1" value="200" id="ItemB" />
    <label for="ItemB">Item B<span style="padding-left:108px;">200 €</span></label>
  </li>
  <li>
    <input type="checkbox" class="option1" value="300" id="ItemC" />
    <label for="ItemC">Item C<span style="padding-left:108px;">300 €</span></label>
  </li>
  <li><strong>Preis <span class="total">0 €</span></strong></li>
</ul>

<ul>
  <li>
    <input type="checkbox" class="option12" value="100" id="ItemA2" />
    <label for="ItemA2">Item A2<span style="padding-left:100px;">100 €</span></label>
  </li>
  <li>
    <input type="checkbox" class="option12" value="200" id="ItemB2" />
    <label for="ItemB2">Item B2<span style="padding-left:100px;">200 €</span></label>
  </li>
  <li>
    <input type="checkbox" class="option12" value="300" id="ItemC2" />
    <label for="ItemC2">Item C2<span style="padding-left:100px;">300 €</span></label>
  </li>
  <li><strong>Price <span class="total2">0 €</span></strong></li>
</ul>

<ul>
  <li>
    <input type="checkbox" class="option13" value="100" id="ItemA3" />
    <label for="ItemA3">Item A3<span style="padding-left:100px;">100 €</span></label>
  </li>
  <li>
    <input type="checkbox" class="option13" value="200" id="ItemB3" />
    <label for="ItemB3">Item B3<span style="padding-left:100px;">200 €</span></label>
  </li>
  <li>
    <input type="checkbox" class="option13" value="300" id="ItemC3" />
    <label for="ItemC3">Item C3<span style="padding-left:100px;">300 €</span></label>
  </li>
  <li><strong>Price <span class="total3">0 €</span></strong></li>
</ul>


<h4>Overallprice: <span class="overallprice" style="font-size:30px;">0</span></h4>

JavaScript

$(document).ready(function() {
        
        $('ul').each(function(){
            var $thisUl = $(this);
            $thisUl.find('input').change(function(){
                var total = 0;
                console.log($thisUl.find('input'));
                $thisUl.find('input:checked').each(function() {
                    total += parseInt($(this).val());
                });
                $thisUl.find('li:last span').html(total + ' €')
            });
        });

        $('input').change(function(){
            var overAllPrice = 0;
        	$('input:checked').each(function(){
                overAllPrice += parseInt($(this).val());
            })
            $('.overallprice').html(overAllPrice);
        })
    });