$().bind() / $().trigger() Custom Event jQuery Demo

Collapse - Expand

$(
	function(){
		
		var jUL = $( "ul" );
		
		// Bind the custom events to the li.
		jUL
			.bind( 
				"collapse",
				function( objEvent ){
					// Collapse LI elements.
					jUL.find( "li" ).slideUp();
				}
				)
			.bind(
				"expand",
				function( objEvent ){
					// Expand LI elements.
					jUL.find( "li" ).slideDown(
						function(){
							jUL.find( "li" ).removeAttr( "style" );
						}
						);
				}
				)
		;
	
	
		// Bind the collapse link.
		$( "a:first" )
			.attr( "href", "javascript:void( 0 )" )
			.click(
				function( objEvent ){
					// Trigger custom event on list.
					jUL.trigger( "collapse" );
					
					// Prevent default.
					return( false );
				}
				)
		;
			
		// Bind the expand link.
		$( "a:last" )
			.attr( "href", "javascript:void( 0 )" )
			.click(
				function( objEvent ){
					// Trigger custom event on list.
					jUL.trigger( "expand" );
					
					// Prevent default.
					return( false );
				}
				)
		;
		
	}
	);