循环给ul下的li添加监听事件遇到的问题

发现一种新的css获取元素的方法：.tab-head li.on a
当li有on这个class属性时对a做处理

window.onload = function(){
var on1 = document.querySelectorAll('.tab-head>li');  //获取ul下的li的方法
        for (var i = 0; i < on1.length; i++){
                on1[i].addEventListener('mouseover',function(){
                    if(this.className != "on"){
                    clear();
                   
                    this.className = "on";  //一定不能用on1[i].className会报错，因为这时的i已经是5了，不存在 
                    }
                })
        }
        function clear(){
            for(j = 0; j<on1.length; j++){
                on1[j].removeAttribute("class","on");
            }
        }
    }