I have a div that I want to show if the user make click in a checkbox (yes) and hide if make click in other checkbox (no)
How can I use javascript, jquery or css code to show and hide the div with id "test" depending on the selection of the user in the checkboxes? (yes or no)
<div class="row" id="test">
//div that I want to show/hide
</div>
//I have this two checkboxes yes__ no__
Yes
<input type="checkbox" name="m_name_no" value="no" id="m_id_no" class="check"/> No </input>
</div>
You can use the checked for this and do something like so
input[type=checkbox]:checked + div {diplay: block;}
here is an exmple I made for you :
HTML :
<div style="clear:both;">
<input type="checkbox" id="test1ck"> <div class="lool" >Check and Uncheck Me</label><br>
<input type="checkbox" id="test2ck"> <div class="lool" >Check and uncheck me too!</div></div>
CSS :
.lool {
display: none;
}
input[type=checkbox]:checked ~ div.lool {
display:block;
color: red;
}
of course make sure your are not trying to select a parent element, there is no way to select a parent with CSS only