Изменяю стиль, с помощью alert наблюдаю изменение, но затем стиль восстанавливается
<html>
<head>
<style>
ul, li{
border:0;
margin:0;
padding:0;
list-style:none
}
ul{
border-bottom:solid 1px #DEDEDE;
height:29px;
padding-left:20px;
}
li{
float:left;
margin-right:2px;
}
.tab a, .tab a:visited{
float:left;
color:#666;
height:30px;
background:url(filter_back.png) no-repeat right -30px;
font-weight:bold;
text-decoration:none;
padding:0 14px 0 0;
}
.tab a span{
float:left;
height:30px;
background:url(filter_back.png) no-repeat left -30px;
padding:0 0 0 14px;
line-height:30px;
cursor:pointer
}
/*
.tab a:hover span{
background-position:left -60px;
}
.tab a:hover{
background-position:right -60px;
}
*/
.active a, .active a:visited{
float:left;
height:30px;
background:url(filter_back.png) no-repeat right 0;
padding:0 14 0 0;
line-height:30px;
cursor:pointer
}
.active a span{
float:left;
height:30px;
background:url(filter_back.png) no-repeat left 0;
padding:0 0 0 14px;
line-height:30px;
cursor:pointer
}
</style>
<script type="text/javascript">
function Select()
{
var items=document.all.tags('li');
var L = items.length;
for (var e=0; e<L; e++)
{
if (e == 2)
{
items[e].className='active';
}
else
{
items[e].className='';
}
}
alert('OK');
}
</script>
</head>
<body>
<ul class="tab">
<li onClick="Select()"><a href="" ><span>1</span></a></li>
<li onClick="Select()"><a href=""><span>2</span></a></li>
<li onClick="Select()"><a href=""><span>3</span></a></li>
</ul>
</body>
</html>