javascript - limit checkbox and uncheck after changing tab -

i trying show , hide divs select tag. in divs there check boxes has logic of disabling them after user checked 2. when changing divs checkboxes staying disabled. reason max 2 checkbox logic disabling checkboxes.

here fiddle

http://jsfiddle.net/sghoush1/yjcyw/

the jquery looks

$('.selectoption').change(function(){         $('.desccontent').hide().eq(this.selectedindex).show();         $('.resourcemsg').hide();     });      var max = 2;     var checkboxes = $('input[type="checkbox"]');      checkboxes.change(function(){         var current = checkboxes.filter(':checked').length;         checkboxes.filter(':not(:checked)').prop('disabled', current >= max);          if(current >= max){             $('.resourcemsg').show();         } else{             $('.resourcemsg').hide();         }     }); 

just uncheck checkboxes , set disabled property false whenever select element changed:

$(function () {     var max = 2;     var checkboxes = $('input[type="checkbox"]');     $('.selectoption').change(function () {         checkboxes.prop({             'disabled': false,             'checked': false         });         $('.desccontent').hide().eq(this.selectedindex).show();         $('.resourcemsg').hide();     });     checkboxes.change(function () {         var current = checkboxes.filter(':checked').length;         checkboxes.filter(':not(:checked)').prop('disabled', current >= max);          if (current >= max) {             $('.resourcemsg').show();         } else {             $('.resourcemsg').hide();         }     }); }); 

jsfiddle example