$(function() {
	
	// J'execute le plugin au niveau de la class ".navigation"
	$('.navigation01').animateMenu();
});

(function($) {

	$.fn.animateMenu = function() {
	
		// Je fais une boucle sur TOUTES les class ".navigation"
		this.each(function() {
		
			// Je stocke mon élément courant (donc ".navigation") dans une variable
			var $this = $(this);
			
			// Je masque tout les éléments "ul.subMenu" qui se trouve dans mon élément courant (.navigation)
			$this.find('ul.subMenu').hide();
			
			// Je fais une boucle sur tout les éléments "li.toggleSubMenu"
			$this.find('li.toggleSubMenu').each(function() {
			
				// J'ajoute l'événement "onclick" sur le PREMIER "a"
				$(this).find('a:first').click(function(e) {
					
					// Si le sous-menu était déjà ouvert, on le referme : 
					if ($(this).next("ul.subMenu:visible").length != 0) { 
            			$(this).next("ul.subMenu").slideUp("normal"); 
            			
        			} 
					// Si le sous-menu est caché, on ferme les autres et on l'affiche : 
       				else { 
						$this.find('ul.subMenu').slideUp('normal');
						$(this).next().slideDown('normal');
        			} 
        				
					// Je désactive l'action par défaut du "a" (donc le "href" du "a" est désactivé)
					e.preventDefault();
				
				});
			
			});
		
		});
	
	}

})(jQuery);