javascript - Enable/Disable Controls on selection of Radio using jquery -

i trying enable/disable controls depending upon selection of radio. doesn't seem working. want disabled text , radio fields enabled when yes radio selected. please help!

asp snippet

                <div class="form-group" >                     <label class="control-label">whether other children of same family studying in primary/ secondary section of svvhs</label><br />                     <input type="radio" value="yes" id="chkrelatedstudentyes" runat="server" name="relatedstudent" required="required"/> <label class="control-label">yes</label><br />                     <input type="radio" value="no" id="chkrelatedstudentno" runat="server" name="relatedstudent" required="required"/> <label class="control-label">no</label>                  </div>                 <div class="form-group">                     <label class="control-label">name of student</label>                     <input maxlength="100" type="text" required="required" class="form-control" placeholder="enter name of related student" id="txtrelatedstudentname" runat="server" disabled="disabled" />                 </div>                 <div class="form-group">                     <label class="control-label">section</label><br />                     <input type="radio" value="primary" id="chkprimary" runat="server" name="section"  required="required" disabled="disabled"/> <label class="control-label">primary</label><br />                     <input type="radio" value="secondary" id="chksecondary" runat="server" name="section"  required="required" disabled="disabled"/> <label class="control-label">secondary</label>                 </div>                 <div class="form-group">                     <label class="control-label">standard</label>                     <input maxlength="12" type="text" required="required" class="form-control" placeholder="enter standard of related student" id="txtstandard" runat="server" disabled="disabled"/>                 </div>                 <div class="form-group">                     <label class="control-label">division</label>                     <input maxlength="12" type="text" required="required" class="form-control" placeholder="enter division of related student" id="txtdivision" runat="server" disabled="disabled"/>                 </div> 

jquery snippet

        <script type="text/javascript">             $('#chkrelatedstudentyes').click(function () {                 $('#txtrelatedstudentname').removeattr("disabled");                 $('#chkprimary').removeattr("disabled");                 $('#chksecondary').removeattr("disabled");                 $('#txtstandard').removeattr("disabled");                 $('#txtdivision').removeattr("disabled");             });             $('#chkrelatedstudentno').click(function () {                 $('#txtrelatedstudentname').attr("disabled", "disabled");                 $('#chkprimary').attr("disabled", "disabled");                 $('#chksecondary').attr("disabled", "disabled");                 $('#txtstandard').attr("disabled", "disabled");                 $('#txtdivision').attr("disabled", "disabled");             }); </script> 

you use jquery prop() method instead of removeattr(). try -

$('#chkrelatedstudentyes').click(function () {    $('#txtrelatedstudentname').prop("disabled", false);    $('#chkprimary').prop("disabled", false);    $('#chksecondary').prop("disabled", false);    $('#txtstandard').prop("disabled", false);    $('#txtdivision').prop("disabled", false); });