Javascript css

Bonjour,

Dans ma page html j'ai un menu, avec deux "onglets", disons 2 rectangles (Accueil/Recherche) de couleurs vert foncé. Quand je survole ma sourie sur un des rectangles, celui ci devient vert clair. J'aimerais que si l'on clic dessus, celui si reste vert clair. La propriété CSS a:active le fait, mais si je clic n'importe où dans la page il redevient vert foncé. Je voudrais qu'il reste vert clair jusqu'au clic sur l'autre rectangle qui passerait à son tour vert clair. Quelqu'un saurait-il me faire un petit JS qui permettrait ceci?

<div id="menu">
<ul>
<li><a href="#" id="accueil" onclick="javascript:display('2')">Accueil</a></li>
<li><a href="#" id="recherche" onclick="javascript:display('1')">Recherche avancée</a></li>
</ul>
</div>

Merci d'avance pour votre attention à ce post.