Increments/decrements quantity on click

by nicosa

HTML

<body>
    <p>
        <img src="http://i.imgur.com/yOadS1c.png" id="minus" width="20" height="20" class="minus"/>
        <input id="qty" type="text" value="1" class="qty"/>
            <img id="add" src="http://i.imgur.com/98cvZnj.png" width="20" height="20" class="add"/>
    </p>
    <p>
        <img src="http://i.imgur.com/yOadS1c.png" id="minus" width="20" height="20" class="minus"/>
        <input id="qty" type="text" value="1" class="qty"/>
        <img id="add" src="http://i.imgur.com/98cvZnj.png" width="20" height="20" class="add"/>
    </p>
</body>

JavaScript

$(function () {
    $('.add').on('click',function(){
        var $qty=$(this).closest('p').find('.qty');
        var currentVal = parseInt($qty.val());
        if (!isNaN(currentVal)) {
            $qty.val(currentVal + 1);
        }
    });
    $('.minus').on('click',function(){
        var $qty=$(this).closest('p').find('.qty');
        var currentVal = parseInt($qty.val());
        if (!isNaN(currentVal) && currentVal > 0) {
            $qty.val(currentVal - 1);
        }
    });
});