<style>
body  {font:10px  verdana;}
div  {width:300px;cursor:hand;padding:5px;background:#ffcccc}
.selected  {background:#ccccff}
</style>

<script>
var  oldObj=null;

function  myOver(obj){
if(obj!=oldObj){
obj.style.backgroundColor="#ccccff";
}
}

function  myOut(obj){
if(obj!=oldObj){
obj.style.backgroundColor="#ffcccc";
}
}

function  myClick(obj){
if(oldObj!=null)oldObj.style.backgroundColor="#ffcccc";
obj.style.backgroundColor="#ccffcc";
oldObj=obj;
}

</script>

<div  onmouseover="myOver(this)"  onmouseout="myOut(this)"  onclick="myClick(this)"  >aaaaaa</div>
<div  onmouseover="myOver(this)"  onmouseout="myOut(this)"  onclick="myClick(this)"  >aaaaaa</div>
<div  onmouseover="myOver(this)"  onmouseout="myOut(this)"  onclick="myClick(this)"  >aaaaaa</div>
<div  onmouseover="myOver(this)"  onmouseout="myOut(this)"  onclick="myClick(this)"  >aaaaaa</div>
<div  onmouseover="myOver(this)"  onmouseout="myOut(this)"  onclick="myClick(this)"  >aaaaaa</div>
<div  onmouseover="myOver(this)"  onmouseout="myOut(this)"  onclick="myClick(this)"  >aaaaaa</div>