jquery关于find（）和children（）的 问题？

问题是如果：$ul.find("li:eq("+$index+")")的时候，点击任何一个li如图一两个ul里面的li都会根据index（）而变色。

而变成$ul.children("li:eq("+$index+")")的时候如图二，不管点击哪一个ul里面的li，只会第一个ul里面的li会变色。

<div>
	<ul>
		<li>A</li>
		<li>B</li>
		<li>C</li>
	</ul>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
	</ul>
</div>

<script>
		$(function(){
			var $ul=$("div").find("ul");
			$("div ul li").on("click",function(){
				var $index=$(this).index();
				$ul.find("li:eq("+$index+")").css("color","#339BFF");
			});
		});
</script>