jquery hide() не работает

[Elflight]

Здравствуйте, коллеги!

Помогите, пожалуйста, разобраться. Делаю простецкое классическое двухуровневое вертикальное меню, в котором список пунктов второго уровня должен появляться справа от списка пунктов первого уровня при наведении мышью на пункт-родитель. Появляется, работает. Но нужно скрывать меню второго уровня, если мышь его покинула, чтобы оно не оставалось висеть. И вот тут проблемы.

  $('#vertical-multilevel-menu>li').on('hover', function() {
    $('ul.child-item').hide();
    var curul = $(this).find('ul.child-item');
    curul.show();
    curul.mouseout(function() {
	  $(this).css('border-color', 'red');
	  $(this).hide();
    });
  });

mouseout отрабатывает, рамка становится красной. А скрытия не происходит Пробовал и css("display", "none"), результата нет, подменю остается висеть...

Подскажите, пожалуйста, что не так?

[wwt]

html и css код тоже было бы не плохо увидеть. Строить догадки просто лень )

Edited January 22, 2013 by wwt

[Sensei]

$('#vertical-multilevel-menu > li')
    .on('mouseenter', function() {
		 $(this).children('ul.child-item').show();
    })
    .on('mouseleave', function() {
		 $(this).children('ul.child-item').hide();
    });