JQuery does not work in Mozilla FF

There is a div block responsible for the popup menu.

<div class="pop-up"> <ul> <li ng-repeat="bandit in bandits">{{bandit.name}}</li> </ul> </div> 

And there is a menu item, when you hover the mouse over which, the menu should appear.

 <li id="we"> <div> <h4>Мы</h4> <span>Кто мы такие</span> </div> </li> 

Menu handlers and li-element handlers.

 $(function() { $('#we').hover(function () { if ($('.pop-up').css('display') === 'none') {// если блок меню не отображен, то отобразить $('.pop-up').slideDown(500); } }, function () { if ($(".pop-up").is(":hover")) { // если после li мы навели курсором на меню, то $(this).css('display', 'block'); // сделать его блочным. } else { $('.pop-up').slideUp(500); // в другом случае, спрятать. } }); $('.pop-up').hover(function () { $(this).css('display', 'block'); }, function () { if (!$("#we").is(":hover")) $('.pop-up').slideUp(500); }); }); 

Everything works fine in all browsers except mozilla.
In it, $(".pop-up").is(":hover") returns false, even if we hover over the menu. What is the problem?