[Mizter]

Конструкция html

<ul class="menu">
	<li><a href="#">My Account</a>
		<ul class="sub-menu">
			<li><a href="#">Главная 2</a></li>
			<li><a href="#dashboard" >Dashboard</a></li>
		</ul>
	</li>
	<li><a href="#dashboard" >Dashboard</a>
		<ul class="sub-menu">
			<li><a href="#">Главная 2</a></li>
			<li><a href="#dashboard" >Dashboard</a></li>
		</ul>
	</li>
	<li><a href="#signout">Sign Out</a></li>
</ul>

Скрипт

$(document).ready(function() {
	$('ul li').has('ul').addClass('include');
		$(".include").click(function() {
			var X = $(this).attr('id');
			if(X == 1) {
				$(".sub-menu").hide();
				$(this).attr('id', '0');
			}
			else {
				$(".sub-menu").show();
				$(this).attr('id', '1');
			}
		});
		//Mouseup textarea false
		$(".sub-menu").mouseup(function() {
			return false
		});
		$(".include").mouseup(function() {
			return false
		});
		//Textarea without editing.
		$(document).mouseup(function() {
			$(".sub-menu").hide();
			$(".include").attr('id', '');
		});
});

Как сейчас работает:
Присваивает элементу li у которого есть под уровень ul, класс стилей.
Определяет элемент по добавленному классу и вычисляет значение id элемента.
При нажатии мышкой на элемент, ему присваивается id = 1, это значит, что он показывается.
При повторном нажатии на элемент (id = 0), меню исчезает.
Так же элемент исчезает при щелчке в любом месте страницы.
При нажатии на какой либо раскрывающийся элемент, раскрываются все.

Задача:
Подсчитывать общее количество элементов li у которых есть под уровень ul и присваивать им порядковый номер в виде id.
Сделать так, чтобы при нажатии на определённый раскрывающейся список выпадал именно он, а не все сразу и причем иногда в одном и том же месте.
Добавить функцию, при которой нажатый элемент с классом присвоенным элементу li который имеет под уровень ul, приобретал дополнительный класс нажатого элемента.