1

i have few radio buttons in my code, now how to unchecked a specific checked radio button when it is clicked again? can some one help me out how do perform this through JQuery? i am facing problem in getting the id of specific radio button that is clicked 

<body>


<div id="container">
<h2>Match words with their meanings</h2>

<div id="innerContainer">
    <div style="height:auto;float:left;width:auto;">
        <input type="text"  id="wordone" value="plane" checked="unchecked" readonly/>
        <input type="radio" id="one"/>
    </div>
    <div style="height:auto;float:left;width:auto;margin-left:80px;">
        <input type="radio"  id="mOne" onclick="testIt();"/>
        <input style="width:400px;" type="text" id="meanmOne" value="state of tranquility,security and harmony" readonly/>
    </div>

</div>

<div id="innerContainer">
    <div style="height:auto;float:left;width:auto;">
        <input type="text" id="wordtwo" value="piece" readonly/>
        <input type="radio"  id="two"/>
    </div>
    <div style="height:auto;float:left;width:auto;margin-left:80px;">
        <input type="radio" id="mTwo" onclick="testIt();"/>
        <input style="width:400px;" type="text"  id="meanmTwo" value="a fraction or part of a whole" readonly/>
    </div>

</div>

<div id="innerContainer">
    <div style="height:auto;float:left;width:auto;">
        <input type="text"  id="wordthree" value="passed" readonly/>
        <input type="radio" id="three"/>
    </div>
    <div style="height:auto;float:left;width:auto;margin-left:80px;">
        <input type="radio" id="mThree" onclick="testIt();"/>
        <input style="width:400px;" type="text" id="meanmThree" value="a medieval soldier" readonly/>
    </div>

</div>

<div id="innerContainer">
    <div style="height:auto;float:left;width:auto;">
        <input type="text" id="wordfour" value="peace" readonly/>
        <input type="radio" id="four"/>
    </div>
    <div style="height:auto;float:left;width:auto;margin-left:80px;">
        <input type="radio" id="mFour" onclick="testIt();"/>
        <input style="width:400px;" type="text"  id="meanmFour" value="not fancy or beautiful" readonly/>
    </div>
</div>

<div id="innerContainer">
    <div style="height:auto;float:left;width:auto;">
        <input type="text"  id="wordfive" value="pain" readonly/>
        <input type="radio" id="five"/>
    </div>
    <div style="height:auto;float:left;width:auto;margin-left:80px;">
        <input type="radio" id="mFive" onclick="testIt();"/>
        <input style="width:400px;" type="text"  id="meanmFive" value="a winged vehicle that files in the air" readonly/>
    </div>

</div>



</div>

user2870778
  • 107
  • 2
  • 13
  • 1
    Your first problem is that you have more than one div using the same ID="innerContainer". The convention ids be unique to the element they tag. The will create problems for you when searching the dom elements. – Cliff Ribaudo Jan 05 '14 at 19:53
  • Are you trying to have your radio buttons work like check boxes, if so you should use check boxes instead. – Musa Jan 05 '14 at 19:54
  • 1
    Here is your answer http://stackoverflow.com/questions/2117538/jquery-how-to-uncheck-a-radio-button Duplicate – laaposto Jan 05 '14 at 19:55

0 Answers0