Afficher un texte quand on clique sur un lien

Bonjour,

Voilà j'ai un code qui permet d'afficher un texte quand on clique dessus, le code marche très bien mais comme je suis un peu exigant j'aimerais savoir une chose : quand on as cliquer sur un lien et que sa affiche le texte, comment faire quand on clique sur un autre lien pour que le précédent ce retire ?

Merci de votre aide !

<script>
function showBlock(idName){
         if(document.getElementById) {//NN6,Mozilla,IE5?
            document.getElementById(idName).style.display = "block";;
         }
         else if(document.all) {      //IE4?
            document.all(idName).style.display = "block";;
         }
         else if(document.layers) {   //NN4?
            document.layers[idName].display = "block";;
         }
      }
      
      function hideBlock(idName){
         if(document.getElementById) {//NN6,Mozilla,IE5?
            document.getElementById(idName).style.display = "none";;
         }
         else if(document.all) {      //IE4?
            document.all(idName).style.display = "none";;
         }
         else if(document.layers) {   //NN4?
            document.layers[idName].display = "none";;
         }
      } 
 
      var opened_blocks = new Array;
      function switchBlock(id) {
         if (opened_blocks[id]) {
            opened_blocks[id] = false;
            hideBlock(id);
         } else {
            opened_blocks[id] = true;
            showBlock(id);
         }
     }
</script>
<ul>
   <li>
   <a href="javascript:switchBlock('legende_sport')">test</a>
   <div id="legende_sport" style="display:none;">DESCRIPTION DE test</div>
   </li>
   <li>
      <a href="javascript:switchBlock('legende_sport')">Sports</a>
      <div id="legende_sport" style="display:none;">DESCRIPTION DE SPORT</div>
   </li>
   <li>Cuisine</li>
</ul>