"Function On click Set Yes and No to the class name"
Bootstrap 4.1.1 Snippet by Ranjith Ramesh

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html> <body> <h2>JavaScript Functions</h2> <p>This example calls a function which performs a calculation, and returns the result:</p> <p id="demo"></p> <div> <div id="one" class="one">Yes</div> <div id="two" class="two">No</div> <input type="radio" name="Yes" class="check" value="Relevance" id="sort-relevance" onclick="onYes()"> <input type="radio" name="No" value="Popularity" class="check" id="sort-best" onclick="onNo()"> </div> </div> </body> </html>
.one, .two{ display: none; } .one.yes, .two.no{ display: block; }
function onYes() { document.getElementById("one").className = "one yes" document.getElementById("two").className = "two" document.getElementById("sort-relevance").checked = true document.getElementById("sort-best").checked = false } function onNo() { document.getElementById("two").className = "two no" document.getElementById("one").className = "one" document.getElementById("sort-relevance").checked = false document.getElementById("sort-best").checked = true } document.getElementById("demo").innerHTML = myFunction(4, 3);

Related: See More


Questions / Comments: