Hide/Show Div Elements Using JavaScript

JavaScript can be used to bring interactivity to you web pages by performing client side scripting. Using the style property of an HTML element, the element can be hidden or shown to the user based upon the required condition. For Example:

<script>
function setDiv(id)
{
if(document.getElementById(id).value==0)
{
document.getElementById('myDiv').style.display='none';
}
else
{

document.getElementById('myDiv').style.display='block';
}
}
</script>

This function can be called on any event of another HTML element as:

<select id="mySelect" name="mySelect" onchange="setDiv(this.id)">
<option>Select one</option>
<option value="0">Hide</option>
<option value="1">Show</option>
</select>

<div id="myDiv" name="myDiv" style="display:none;">
<span>Hi......!!!!!!! </span>
</div>

You can place any thing inside the myDiv element. Further more buy using some jQuery you can even add some animation effects.