jquery-ui spinner

calculating total

HTML

<link rel="stylesheet" href="http://www.carport.com/jqueryui/development-bundle/themes/base/jquery.ui.all.css">
<script src="http://carportpros.com/js/jquery.ui.spinner.js"></script>
<input type="text" class="testspin" data-price="50" name="testspin1" value="0" />
<input type="text" class="testspin" data-price="25" name="testspin2" value="0" />

<p>500</p>

JavaScript

$('input[class="testspin"]').spinner({ min: 0, max: 10});

$('.ui-spinner-button').click(function() { $(this).siblings('input').change(); });

$('.testspin').spinner().change(function(){

	var sum = 500;
    $('.testspin').each(function() {
        sum += (Number($(this).val()) * $(this).data('price') );
    });
    $('p').html(sum);
    
    //var total = $('p');
    //total.html( Number(total.html()) + Number($(this).spinner('value') ) );
    //alert($(this).spinner('value'));
        });