title: Checkbox and click event handling
body: <p>I'm trying to set a textbox to 'readonly', add a class, and put a text into the textbox at that moment when I check the checkbox. Moreover, I'm also trying to remove 'readonly' attribute from the textbox, add a class, and delete text in the textbox.</p>
  
  <p>I have</p>
  
  <pre><code>$('#CheckBoxSectionCode').click(function () {
      if ($(this).is(':checked')) {
          $('#TextBoxSectionCode').attr('readonly', 'readonly');
          $('#TextBoxSectionCode').addClass('disabled');
          $('#TextBoxSectionCode').text(document.getElementById('TextBoxSectionName').val);
          }
      else {
          $('#TextBoxSectionCode').attr('readonly', false);
          $('#TextBoxSectionCode').addClass('abled');
          $('#TextBoxSectionCode').text('');
      }
  });
  </code></pre>
  
  <p>This code doesn't work for me.</p>
  
  <p>Thanks,</p>
  
  <p>Phillip</p>
  
  <hr>
  
  <p>Thanks everyone for answers.</p>
  
  <p>According to your comments and answers, I've changed my code but it's still not working.</p>
  
  <pre><code>$('#CheckBoxSectionCode').click(function () {
      if ($(this).is(':checked')) {
          $('#TextBoxSectionCode').prop('readonly', true);
          $('#TextBoxSectionCode').addClass('disabled');
          $('#TextBoxSectionCode').text('disabled');
  
      }
      else {
          $('#TextBoxSectionCode').prop('readonly', false);
          $('#TextBoxSectionCode').removeClass('disabled').addClass('enabled');
          $('#TextBoxSectionCode').text('');
      }
  });
  </code></pre>
  
  <p>I'm using chrome browser to run this code, and using developer tools in chrome and put a break point at the code above to see what's happening in the jquery. However, when I click the check box to check/uncheck, nothing happens there. </p>