Вычисления Javascript не возвращают правильную сумму?

У меня есть сценарий, который вычисляет цену, количество и доставку. Когда числа добавляются вместе, они должны отображаться следующим образом:

Итого: [сумма]

Доставка: [количество]

Всего: [общая сумма + доставка]

То, что происходит, является полным, но доставка показывает общую сумму, а не стоимость доставки.

Вот сценарий, который я использую для вычисления итогов:

function calculate() {
var total = 0;
var shiptotal = 0;
var subtotal = 0;
$('.button-click').each(function () {
    var amt = parseInt($(this).prev().val());
    var qty = parseInt($(this).parent().find(".quantity").val());
    var ship = parseInt($(this).parent().find(".ik-ship").val());
    total += ((ship += amt) * qty);
    shiptotal += (ship * qty);
    subtotal += (amt * qty);

});
$('#Amount').val(total.toFixed(2));
$('.total-amount').html( total.toFixed(2) );
$('.sub-total-amount').html( subtotal.toFixed(2) );
$('.shipping-amount').html( shiptotal.toFixed(2) );
}

HTML:

<li>
 <label for="CAT_Custom_410680" class="bold">Spin Pen - $62.00  <br> <a class="fancybox" href="#spin-pen">Learn More</a></label>
     <input type="text" class="cat_textbox quantity " id="CAT_Custom_410680" name="CAT_Custom_410680" maxlength="4000" value="0" />
     <input type="hidden" class="ik-ship" value="1.00">
     <input type="hidden" class="ik-price" value="62.00">
     <ul class="button-group radius button-click">
        <li><a href="#" class="small button secondary"><i class="fa fa-plus"><span class="hide">+</span></i></a></li>
        <li><a href="#" class="small button secondary"><i class="fa fa-minus"><span class="hide">-</span></i></a></li>
     </ul>
</li>

Как вы заметите, стоимость доставки - это установленная стоимость.

Что я делаю неправильно и как это исправить?

Вот сценарий кода