function initBrowseSubSubjects()
{
    // get the subject li
    var subject = $(".subject").each( function()
    {
        // get the ol within the subject li
        $(this).children("ol").each( function()
        {
            // insert the collapse/expand button before the ol
            //$(this).before("<span class=\"down arrow browse-sub\"></span>");     
            
            // close this
            $(this).hide();
                   
        });
        
        $(this).children("h3").each( function()
        {
            // insert the collapse/expand button afer the h3
            $(this).after("<span class=\"down arrow browse-sub\"></span>"); 
        });
        
    });
        
    // add the expand/collapse to the button
    $(".browse-sub").click( function( e )
    {
        e.preventDefault();
        
        //$( this ).next().slideToggle( "slow", toggleSetup(this) ); 
        //$( this ).next().next().slideToggle( "slow", toggleSetup(this) ); 
        $(this).parent().children("ol").slideToggle( "slow", toggleSetup(this) );
        
    });
    
    function toggleSetup( arrowButton )
    {
        if ( $( arrowButton ).hasClass( "up" ) ) // pod is open so close it
		{
			// swap css class
			$( arrowButton ).addClass( "down" );
			$( arrowButton ).removeClass( "up" );					
														
		}
		else                                     // pod is closed so open it
		{
			// swap css class
			$( arrowButton ).addClass( "up" );
			$( arrowButton ).removeClass( "down" );								    				    
		    		    
		}
    }
}