Show/Hide "a div" by clicking on radio button

Question

How do I, when dialing a radio buttom, release a content from a div? Type this example only using radio buttom! Thank you

    <label>Mostrar termos:</label> <input type="checkbox" id="termos" />
<div id="termoTexto">
    Seus termos estarão aqui
</div>


    input[type=checkbox]:checked ~ #termoTexto{
    display: block;
}
#termoTexto {
    display:none;
}

Answer 1

Just use the id radio as selector. But radio behaves differently than checkbox, which can be checked/unchecked.

#termos:checked ~ #termoTexto{
    display: block;
}
#termoTexto {
    display:none;
}

<label>Mostrar termos:</label> <input type="radio" id="termos" />
<div id="termoTexto">
    Seus termos estarão aqui
</div>

---

Since you tagged it javascript in question, has a solution with Javascript also:

document.getElementById("termos").onclick = function(){
   document.getElementById("termoTexto").style.display = "block";
}

#termoTexto {
    display:none;
}

<label>Mostrar termos:</label> <input type="radio" id="termos" />
<div id="termoTexto">
    Seus termos estarão aqui
</div>

Just change the display element by clicking on the radio.