How to set delay time in this code?

How to set delay time in this code?

Hello everyone, I am new here. Please be patient with me. I have this code from this link 

http://www.kriesi.at/archives/create-a-multilevel-dropdown-menu-with-css-and-improve-it-via-jquery 

  1. function mainmenu(){
    $
    (" #nav ul ").css({display: "none"}); // Opera Fix
    $
    (" #nav li").hover(function(){
                    $
    (this).find('ul:first').css({visibility: "visible",display: "none"}).show(400);
                    
    },function(){
                    $
    (this).find('ul:first').css({visibility: "hidden"});
                    
    });
    }

     $

    (document).ready(function(){
            mainmenu
    ();
    });
I want to add a few seconds of delay on mouse out. How could that be done? One suggestion to me was to do something like: 

  1. function mainmenu(){
    $
    (" .nav ul ").css({display: "none"}); // Opera Fix
    $
    (" .nav li").hover(
        
    function () { $(this).find('ul:first').css({ visibility: "visible", display: "none" }).show(400); }
      
    , function () { setTimeout(function () { $(this).find('ul:first').css({ visibility: "hidden" }); }, 40000); }
    );
    }
But that doesn't work. The effect is still the same. Any advice please?

Thank you very much.