javascript做的tab页切换问题

Question

<div id="tabarea">    <ul class="clearFix">        <li>aaaaaaaaaa</li>        <li>bbbbbbbbbb</li>        <li>cccccccccc</li>        <li>dddddddddd</li>    </ul>    <div class="box active">1</div>    <div class="box">2</div>    <div class="box">3</div>    <div class="box">4</div></div><script>function tab(){    var eleId = document.getElementById("tabarea");    var li = eleId.getElementsByTagName("li");    var div = eleId.getElementsByTagName("div");    for(var i=0;i<li.length;i++){        li[i].onclick = function(){            for(var j=0; j<li.length; j++) {                if (this == li[j]) {                    li[j].className = "on";                    div[j].className = "box active";                }                else {                    li[j].className = "";                    div[j].className = "box";                }            }        }    }}tab();</script>有一处不明白的地方,点击li[i]的时候js怎么给第div[i]添加classname的