mouseout на вложенном элементе

[Marv]

Осваиваю jQuerry. Начал вроде бы с простого меню с fadein/fadeout эффектом. При наведении на ссылку верхнего уровня появляется div вложенного меню. И соответственно при mouseout на этом div'е, он исчезает.
Проблема заключается в том, что mouseout срабатывает и при переходе от div'а к пунктам списка-потомка. То есть div id="par1_ch" появляется, а затем, когда я навожу курсор на пункты вложенного в него меню, он снова исчезает. Что я сделал не так?

$(document).ready(function () {
	$("a.lv1.parent").mouseover(function () {
		$('#' + this.id + '_ch').fadeIn('fast');
	});
	$("div.submenu").mouseout(function () {
		$(this).fadeOut('fast');
	});
});

<ul>
	<li>
		<a class="lv1 parent" id="par1" href="/">aaaaaaaaaaa</a>
		<div id="par1_ch" class="submenu">
			<ul>
				<li><a href="/">bbbbbbbbbbb</a></li>
				<li><a href="/">bbbbbbbbbbb</a></li>
			</ul>
		</div>
	</li>
	<li><a class="lv1" href="/">aaaaaaaaaaa</a></li>
</ul>

[Matre]

$(document).ready(function () {
	$("a.lv1.parent").mouseover(function () {
		$(this).next("div.submenu").fadeIn("fast");
	});
	$("div.submenu").mouseout(function (event) {
		if ( $(event.relatedTarget).closest("div.submenu").length !== 0 )
			return;
		$(this).fadeOut('fast');
	});
});

[Marv]

Спасибо огромное, буквально за полчаса до вашего отвта додумался до closest. Но у вас намного изящнее)

[Marv]

И еще такой вопрос: если несколько раз быстро навести курсор, то fadein и fadeout продолжают выпоняться несколько раз подряд. Как можно прервать анимацию при новом срабатывании?