change event on radiobutton click

change event on radiobutton click

Hello and thank you to everyone who has previously helped me.

This time I don't have a problem as my code is working.  I am only asking if there is a more efficient way (i.e. less code) to accomplish my goal of utilizing a show hide based on a radio button clicked.

See jsfiddle

In the jsfiddle above, if you click the Other button, a required textfield appears.  If you click any other radio button, the textfield disappears and is no longer required.

It's the hide part of the code, below, that I figure there is a more efficient way to write.


  1. $("#semester_1, #semester_2, #semester_3, #semester_4").change(function() {
  2. var checked =this.checked
  3. if(checked){
  4. $('.semester').hide();
  5. $('#short_field_003').removeClass("required error");
  6. $('#short_field_003').val("");
  7. }
  8. }).change();

I tried the following but it didn't work.


  1. $("#semester_5").change(function() {
  2. var checked =this.checked
  3. if(checked){
  4. $('.semester').show();
  5. $('#short_field_003').addClass("required error");
  6. }
  7. if(!checked){
  8. $('.semester').hide();
  9. $('#short_field_003').removeClass("required error");
  10. $('#short_field_003').val("");
  11. }

Thanks again.  Any help in pointing me in the right direction will be greatly appreciated!