jquery - why is the code providing multiple option for the child1 radiobuttons ??? i dont want that -

html:

<input type="radio" id="chkmain" name="chkmain"/> <input type="radio" id="chkmain1" name="chkmain" /> <input type="radio" id="chkmain2" name="chkmain" />  <input class="child" type="checkbox" id="chk1" disabled="true" /> <input class="child" type="checkbox" id="chk2" disabled="true" /> <input class="child" type="checkbox" id="chk3" disabled="true" /> <input class="child" type="checkbox" id="chk4" disabled="true" /> <input class="child" type="checkbox" id="chk5" disabled="true" /> <input class="child" type="checkbox" id="chk6" disabled="true" /> <input class="child" type="checkbox" id="chk7" disabled="true" />  <input class="child1" type="radio" id="tone1" disabled="true"/> <input class="child1" type="radio" id="tone2" disabled="true"/> <input class="child1" type="radio" id="tone3" disabled="true"/> 

script:

$( function()    {     $( "input:radio[name='chkmain']" ).click( function() {         if ( $( ).attr( 'id' ) == 'checkmain' )         {             $("input.child").removeattr( "disabled" );         }         else         {              $("input.child, input:radio.child1").attr( "disabled");          }   }); }); 

jsfiddle.

you need add "name" attribute radio buttons indicate how grouped like:

<input class="child1" type="radio" id="tone1" name="group1" disabled="true"/> <input class="child1" type="radio" id="tone2" name="group1" disabled="true"/> <input class="child1" type="radio" id="tone3" name="group1" disabled="true"/> 

working sample here: http://jsfiddle.net/rniemeyer/dlt5n/

also changed if statement match "chkmain" instead of "checkmain" , else statement changed .attr("disabled", true) value set.