如何通过js来更改html代码动态更改样式

Question

<DIV class=nav_1 style="MARGIN-TOP: 36px; MARGIN-LEFT: 250px; WIDTH: 650px; POSITION: absolute">
<UL class=nav_1_bg>
  <LI><IMG src="images/nav_1_left.gif"> </LI>
  <LI class=menu>
  <UL id=topmenu>
    <LI class=menu_on>
    <SPAN id=tsub-menu-10001>
    <DIV class=pad10>首页</DIV></SPAN>
    </LI>
    <LI class=menutiao></LI>
    <LI><A id=tsub-menu-10002>栏目一</A> </LI>
    <LI class=menutiao></LI>
    <LI><A id=tsub-menu-10003>栏目二</A> </LI>
    <LI class=menutiao></LI>
    <LI><A id=tsub-menu-10004>栏目三</A> </LI>
    </UL>
  </LI>
  <LI><IMG src="images/nav_1_right.gif"> 
  </LI>
  </UL>
 </DIV>首页那个样式是区别于栏目一、二、三样式的当我点击了栏目一时将“首页”那个li代码改
<LI class=menutiao></LI> <LI><A id=tsub-menu-10002>首页</A> </LI>
将栏目一更改为<LI class=menu_on> <SPAN id=tsub-menu-10001><DIV class=pad10>栏目一</DIV></SPAN></LI>
onclike 这个事件应该怎么写啊请教各位大侠

Answer 1

<style>
.css1{background:red;}
.css2{background:blue;}
</style>
<script type="text/javascript">
var changeStyle=function(){
var obj=document.getElementById("name");
obj.className="css1";//这里将对象NAMAE的样式动态设置成css2
}
</script><input id="name"  class="css2">
<input type="button" value="换样式" onclick="changeStyle();"/>

Answer 2

DOMObject.className = 'css1';