How to get the value of a Bootstrap toggle button in jQuery

Question

I have this markup and jQuery but I cannot successfully capture the button value or on/off or any form of recognition of the setting of the toggle:

HTML

<div class="form-group">     <label class="col-md-2 control-label" for="payMethod">Payment Method</label>       <div class="col-md-2">         <label class="checkbox-inline bootstrap-switch-noPad" for="payMethod">           <input type="checkbox" id="payMethod" name="payMethod" data-size="small" value="Credit" data-on-text="Credit" data-on-color="success" data-off-text="Cash" data-off-color="warning" tabindex="13">         </label>       </div>   </div> 

jQuery

$('#payMethod').on( 'change', function() {   alert('slid'); }); // does not work  $( "#payMethod" ).click(function() {   alert( $('#payMethod').val() ); }); // does not work  $('#payMethod').change(function() {   alert('Toggle: ' + $(this).prop('checked')); }); // does not work  $('input[type=checkbox][name=payMethod]').change(function() {   alert('help'); // does not work }); 

Here are the slider buttons (there is no checkbox):

Answer 1

you can try this

$("#payMethod").change(function(){     if($(this).prop("checked") == true){        //run code     }else{        //run code     } });