最简单的jquery导航，感谢csdn上的大神帮忙

<div class="shang"><ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul></div>
<div class="xia"><div class="one">sd</div><div class="two">sdsd</div><div class="three">sdsd</div><div class="four">sdsd</div></div>现在这些个one，two等等都是隐藏的，但是当鼠标移动到第一个li上one显示，移动到第二个li上two显示，移走就消失。。。怎么做到？

$('.shang li').hover(function(){$('.xia div').eq($('.shang li').index(this)).show();},function(){$('.xia div').eq($('.shang li').index(this)).hide();})