javascript - on('change') not working as expected -

below code working 1 cycle of select , deselect all. works fine if change syntax .change instead of .on('change'). .change works upto 1.8.3 version of jquery not after that.

<div id="mainframe" align="center">   <div align="left"><strong>select checkbox demo.</strong></div>   <table border="0" cellpadding="5" cellspacing="1" class="table">     <th><input type="checkbox" id="selectall"/></th>     <th>programming language</th>     <th>rating</th>     <tr>       <td align="center"><input type="checkbox" class="case" name="case" value="1"/></td>       <td>php</td>       <td>5</td>     </tr>     <tr>       <td align="center"><input type="checkbox" class="case" name="case" value="2"/></td>       <td>jsp</td>       <td>4</td>     </tr>     <tr>       <td align="center"><input type="checkbox" class="case" name="case" value="3"/></td>       <td>asp</td>       <td>3</td>     </tr>   </table> </div> 

$("#selectall").on('change',function () {   if($(this).is(":checked")){     $('.case').attr('checked',true);   }else{     $('.case').attr('checked',false);   } }); 

pen

issue way attr used. simplify using prop instead.

$(function(){     $("#selectall").on('change',function () {         $('.case').prop('checked', this.checked);     }); }); 

fiddle

update based on question in comment

version 1.3.2 of jquery not support on prop. old version attr handles specific attribute value (for element attribute) or boolean value (for element property) add/remove attribute value (in case of attributes of kind (checked, selected...)) or set or unset element property based on type of value specified. later version of jquery introduced prop setting element property , attr set element attribute. reason. note on not supported in 1.3.2 version of jquery.