为什么我这个 JS 好像没效果

<script type="text/javascript">
window.onload = function(){
    var nav = document.getElementById('nav').getElementsByTagName('li');
    for (var i=0;i<nav.length;i++){
        nav[i].onclick = function(){
            for (var i=0;i<nav.length;i++){
                nav[i].className = '';
            }
            this.className='current';
        }
    }
}
</script>

<style type="text/css">
div#nav ul { margin:0 auto; overflow:hidden; list-style:none; }
div#nav ul li { padding-top:10px; margin-right:20px; }
div#nav ul li a { font-size:14px; font-weight:bold; color:#000; }
div#nav ul li a:hover { color:#701f5f; text-decoration:none; font-size:18px; }
div#nav ul li.current a { color:#701f5f; text-decoration:none;}
</style>
<div id="nav">
<ul>
<li>
<a href="{#link#}" target="{#target#}">{#title#}</a>
</li>
//
</ul>
</div>