Javascript Not Firing When It Should In Form

hi, I have a form with attributes I set to disable if a checkbox is checked.

My form is very simple

<div class="row">
		<?php echo $form->labelEx($model,'enabled'); ?>
		<?php echo  $form->checkBox($model,'enabled');?>
	</div>

	<div class="row">
		<?php echo $form->labelEx($model,'A'); ?>
		<?php echo  $form->textField($model,'A',array('rows'=>1, 'cols'=>50));?>
	</div>

	<div class="row">
		<?php echo $form->labelEx($model,'B'); ?>
		<?php echo  $form->passwordField($model,'B',array('rows'=>1, 'cols'=>50));?>
	</div>

and just below it I wrote my script like :

<script type="text/javascript">
$(document).ready(function($) {
  if(!$("#myModel_enabled").attr('checked')) {
    $("#myModel_A").attr("disabled",true);
    $("#myModel_B").attr("disabled",true);
  }
  $("#myModel_enabled").change(function(){
    if(!$(this).attr('checked')) {
      $("#myModel_A").attr("disabled",true);
      $("#myModel_B").attr("disabled",true);
    } else if($(this).attr('checked')) {
      $("#myModel_A").attr("disabled",false);
      $("#myModel_B").attr("disabled",false);
    }
  });
});
</script>

I have well defined the css parameter for input[disabled] but nothing happens though...

Can you help ?