JS实现隔行变色的问题
var oTab = document.getElementById('tb1');               
var oTr = document.getElementsByTagName('tr');                
for(var i=0;i<oTr.length;i++){
    if(i%2==0){
oTr[i].style.backgroundColor = "#E0FFFF";
    }else{
oTr[i].style.backgroundColor = "#FF0000";
    }
}
上面是JS代码
<table>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
</table>
<table  id="tb1" >
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
</table>
数据是循环的，现在想实现点击第一个table里的表头项目实现下面的内容隔行变色。
现在的状况是IF都能进去，但是就是不能给画面附上颜色。郁闷，求大神
------解决方案--------------------

 <style>

    table{ border-collapse:collapse; }

    td{border:1px solid #000; padding:5px }

</style>

 

<table id="tbhead" bgcolor="#aaaaff" >

<tr>

<td>1</td>

<td>2</td>

<td>3</td>

</tr>

</table>

<table  id="tb1" >

 <tr><td>1</td><td>2</td><td>3</td></tr>

 <tr><td>1</td><td>2</td><td>3</td></tr>

 <tr><td>1</td><td>2</td><td>3</td></tr>

 <tr><td>1</td><td>2</td><td>3</td></tr>

 <tr><td>1</td><td>2</td><td>3</td></tr>

 <tr><td>1</td><td>2</td><td>3</td></tr>



</table>

<script language="javascript"> 

 

  var tbhead = document.getElementById('tbhead'); 

  var oTab = document.getElementById('tb1');                 

  var rs=  oTab.rows,cIdx ;     

  tbhead.onclick=function(evt){

  	var el=window.event?event.srcElement:evt.target;

  	if(el.tagName!='TD' 
------解决方案--------------------
  el.cellIndex==cIdx ) return;

  	

  	//console.info( el.cellIndex )

  	cIdx=cIdx
------解决方案--------------------
0;

		for(var i=0;i<rs.length;i++){

			rs[i].cells[cIdx].style.backgroundColor = "#fff";

			rs[i].cells[el.cellIndex].style.backgroundColor = i%2?'#88FFFF':'#E0FFFF';

		}	

		cIdx=el.cellIndex;

  }

 

</script>