shorting this code for click menu
<p>Feel like this is a long way round of doing it. dont think the function var is needed but struggle to get this to work otherwise, i have changed the bottom part of the script to do onmouse leave but always target the wrong element.</p>

<p>script the looks for div to be clicked and then display ul and hide on mouseout:</p>

<pre><code>$(function() {
    var toggleMenu = function(e) {
        var self = $(this),
            elemType = self[0].tagName.toLowerCase(),
            //get caller
            menu = null;
        if (elemType === 'a') {
            //anchor clicked, nav back to containing ul
            menu = self.parents('ul').not('ul#logo_menu');
        } else if (elemType === 'ul') {
            //mouseleft ul, ergo menu is this.
            menu = self;
        }
        if (menu) {
            menu.hide('medium');
        }
        e.preventDefault();
        return false;
    };
     $(document).ready(function() {
        $('div.logo_menu').click(function(e) {
            $('ul#logo_menu ul').show('medium');
            console.log('div clicked');
            e.preventDefault();
            return false;
        });
        $('ul#logo_menu a').click(toggleMenu);
        $('ul#logo_menu ul').mouseleave(toggleMenu);
    });
});
</code></pre>

<p>when i target a. to be clicked it is easier to write?</p>

<pre><code>$(document).ready(function() {
     $('a.drop').click(function(e) {
         $(this).next("div").show('slow');
         console.log('div clicked');
         e.preventDefault();
         return false;
     });
    $('li.mainmenudrop').mouseleave(function() {
        $(this).children("div").hide('slow');
    });
});
</code></pre>
