[Setta]

Подскажите!

Есть несколько кнопок меню. Нужно, что бы при нажатии на одну из них, менялся ее цвет и цвет текста на кнопке. И фиксировался.А при нажатии на другую кнопку, цвет кнопки и цвет текста у первой возвращался,а новая кнопка в свою очередь так же меняла цвет и цвет текста на ней.
Если можно, покажите, как это можно организовать.Спасибо!

Прилагаю код для подробности:



CSS:

h1 {  
  font-family:Verdana, Arial, Helvetica, sans-serif;  
  font-size:13px;  
  font-weight:bold;  
  margin:0;  
  padding:0;}  

 hr {  
  border:none;  
  border-top:1px solid #CCCCCC;  
  height:1px;  
  margin-bottom:25px;}  

 ul {  
  list-style: none;  
  margin: 0;  
  padding: 0;}  

 img {border: none;}  

 #menu {  
  width: 168px;  
  margin: 0px;  
  border-style: solid solid none solid;  
  border-color: #000;  
  border-size: 1px;  
  border-width: 1px;}  

 #menu li a {  
  height: 32px;  
  voice-family: "\"}\"";  
  voice-family: inherit;  
  height: 24px;  
  text-decoration: none;}  

 #menu li a:link, #menu li a:visited {  
  color: #9cff00;  
  display: block;  
  background: url(http://wallaby.ucoz.ru/_ph/1/2/631039619.gif);  
  padding: 8px 0 0 10px;}  

 #menu li a:hover {  
  color: #9cff00;  
  background: url(http://wallaby.ucoz.ru/_ph/1/2/138374785.gif) 0 -32px;  
  padding: 8px 0 0 10px;}

HTML:

<div id="menu">  
 <ul>  
 <li><a href="#"><span style="color:fff"><b>Главная</b></span></a></li> 
 <li><a href="#"><span style="color:fff"><b>Форум</b></span></a></li> 
 <li><a href="#"><span style="color:fff"><b>Галерея</b></span></a></li> 
 <li><a href="#"><span style="color:fff"><b>ClanWars</b></span></a></li> 
 <li><a href="#"><span style="color:fff"><b>Фильмы</b></span></a></li> 
 </ul> 
 </div>