Hi there.

Ive a menu that shows content in a div after the user clicks on the corresponding link but the div actually showing up doesnt dissapear when the user clicks another link.

How do i do to make the displayed div to hide when the user clicks another link?

Here is the HTML code :

<script type="text/javascript" src="altera_display.js"></script>
                 <li><a href="#" onclick="javascript: altera_display('Div01');">Sobre</a></li>
                 <li><a href="#" onclick="javascript: altera_display('Div02');">Top5</a></li>
                 <li><a href="Historia.html">Historia dos Caminhos de ferro</a></li>
                 <li><a href="#">Pelo Mundo</a>
                                 <li><a href="#">Europa</a> </li>
                                 <li><a href="#">Asia</a> </li>
                                 <li><a href="#">Oceania</a> </li>
                                 <li><a href="#">Africa</a> </li>
                                 <li><a href="#">America do Norte</a> </li>
                                 <li><a href="#">America do Sul</a> </li>
                 <li><a href="Factos.html">Factos</a> </li>
         <div id="Div01" style="display: none">Content Div</div>
         <div id="Div02" style="display: none">Content Div</div>
And here is the Javascript code:

function altera_display(id) {
if(document.getElementById(id).style.display=="none") {
         document.getElementById(id).style.display ="block";
         document.getElementById(id).style.display ="none";