JQuery Click Event

JQuery Click Event

by Ritwika Das

HTML

<form id="myForm">
        <div class="row">
            <div class="col-sm-4">
                <label>CAR</label>
            </div>
            <div class="col-sm-8">
                <label><input  name="radioName" value="800" type="radio"> Mercedez Benz</label>
                <label><input name="radioName"  value="800" type="radio"> Lexus LS 300h</label>
                <label><input name="radioName"  value="800" type="radio"> Audi A4 Avant</label>
                <label><input name="radioName" value="800" type="radio"> BMW 535i</label>
                <label><input name="radioName"  value="1000" type="radio"> Premium</label>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-4">
                <label>KM</label>
            </div>
            <div class="col-sm-8">
                <label><input type="text" class="kilo" name="kilo">km</label>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-4">Total</div>
            <div class="col-sm-8">
                $<p id="total"></p>
            </div>
        </div>
        <a class="calc-button" href="#">Count</a>
    </form>

JavaScript

$(document).ready(function(){
    $('.calc-button').on('click', function() {
    		/*$('#myForm input').on('change', function() {
           alert($('input[name=radioName]:checked', '#myForm').val()); 
        });*/
        var a = $('input[name=radioName]:checked').val();
        var b = $('input[name=kilo]').val();
        var total = a * b;
        $('#total').text(total);
    }                
);
});