[poorking]

<script type = "text/javascript" src = "http://code.jquery.com/jquery-1.6.1.min.js"></script>
<style type = "text/css">
.mymegabutton{
	color: gray;
}

.hvr{
	color: green;
}

.act{
	color: red !important;
}
</style>
<button class = "mymegabutton">button 1</button>
<button class = "mymegabutton">button 2</button>
<button class = "mymegabutton">button 3</button>
<button class = "mymegabutton">button 4</button>
<button class = "mymegabutton">button 5</button>
<button class = "mymegabutton">button 6</button>
<script type = "text/javascript">
$(".mymegabutton").each(function(i, a){
	$(this).hover(function(){
		$(this).addClass("hvr");
	}).mouseout(function(){
		$(this).removeClass("hvr");
	}).click(function(){
		var that = this;
		$(".mymegabutton").each(function(){
			if(this === that){
				$(this).toggleClass("act");
				return;
			}
			$(this).removeClass("act");
		})		
	})
})

</script>

ну вот jquery, принцип тот же, цсс классы тебе все равно надо написать самому, просто вместо "hvr", "act" свои классы подставь