jQuery mouseenter/mouseleave virker ikke som forventet

JScript kode 

 $(".menu-item").mouseenter(function(){
         if(!$(this).hasClass("aktiv"))
         {
             $(this).css("z-index","1002");
             $(".black_overlay").fadeIn(100);
             
             var content_height = $("#inner-content").outerHeight();
             $(this).animate({height : 120 + content_height + "px"},
                 { 
                     duration: 300,
                     complete: function()
                     { 
                         $(this).find(".inner-menu-item").fadeIn(300);
                     }
                 }
             );
         }
     }).mouseleave(function(){
         
         if(!$(this).hasClass("aktiv"))
         {
             var theElement = $(this);
             theElement.find(".inner-menu-item").fadeOut(300, function(){
                 theElement.animate({height : "115px"},
                 { 
                     duration: 300,
                     complete: function()
                     {
                         $(".black_overlay").fadeOut(100, function() { theElement.css("z-index","1000")});
                     }
                 });
             });
         }
     });