Javascript: Make elements appear based on user interaction

[mrtylersmith]

How would I make an element visible/invisible based on user interaction with another element? For example: say I have two radio buttons: yes and no. If the user selects yes, a text field appears, and if no is selected it disappears. I don't need the code, just a starting point to do some learning on my own.
Thanks for reading

[hpwebsolutions]

Hi Mr Smith,
That is an easy one. You could use the following code. It should be easy to understand but if you have any questions reply back.



<script type="text/javascript">
function text_display(radio) {
var some_text_element_id = document.getElementById('some_text');
if(radio.value=='yes')
some_text_element_id.style.display = 'block';
else if(radio.value=='no')
some_text_element_id.style.display = 'none';
}
</script>

<input type="radio" onclick="text_display(this)" name="radio1" value="yes" />yes<br />
<input type="radio" onclick="text_display(this)" name="radio1" value="no" />no<br />

<div id="some_text" style="display:none">
hello world
</div>