METHOD1:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function change()
{
var lis=document.getElementsByTagName("li");
for(var i=0; i<lis.length; i++)
{
lis[i].οnclick=function()
{
for(var j=0; j<lis.length; j++)
{
lis[j].className="";
}
this.className="style1";
};
}
}
</script>
<style type="text/css">
.style1
{
background-color:red;
}
</style>
</head>
<body οnlοad='change()'>
<ul>
<li>aaaaaaa</li>
<li>bbbbbbb</li>
<li>ccccccc</li>
</ul>
</body>
</html>
METHOD2:
<ul>
<li οnclick="this.style.backgroundColor='red'">afsdfas</li>
</ul>
METHOD3:
<script language="javascript">
function hc(obj,cssname) {
var list = document.getElementsByTagName("li");
for(i=0; i<list.length; i++){
list[i].className = "";
}
obj.className = cssname;
}
</script>
<style type="text/css">
.linow { background-color:red;}
</style>
</head>
<body>
<ul>
<li onClick="hc(this,'linow')">aaaaaaaaa</li>
<li onClick="hc(this,'linow')">bbbbbbbb</li>
<li onClick="hc(this,'linow')">cccccccc</li>
<li onClick="hc(this,'linow')">ddddddddd</li>
</ul>
<script type="text/javascript"> </script>