How can I simplify this coding?

Here's a link to a page that uses the code in question......

http://optiq-customtees.zxq.net/store04c.html

if you click on each button you'll notice each one lights up as you click on it. I also have a sub menu set to pop up under the "Customize" button which I have linked to another sub menu that can be accessed through the "Quick Pick" button that pops up. Here's the JS I came up with to make it work..

/*-------- Site Links --------*/		$(document).ready(function(){
			$('#home-button').click(function(){
				$('#home-button')		.removeClass('nav-link');
				$('#home-button')		.addClass('nav-link-selected');
				$('#customize-button')	        .removeClass('nav-link-selected');
				$('#gallery-button')	        .removeClass('nav-link-selected');
				$('#free-stuff-button')	        .removeClass('nav-link-selected');
				$('#testim-button')		.removeClass('nav-link-selected');
				
				$('#customize-button')	        .addClass('nav-link');
				$('#gallery-button')	        .addClass('nav-link');
				$('#free-stuff-button')	        .addClass('nav-link');
				$('#testim-button')		.addClass('nav-link');
				
				$('#prodfr')			        .addClass('hidden');
				$('#cust-fr')			.addClass('hidden');  	
			})
			
			$('#customize-button').click(function(){
				$('#customize-button')	        .removeClass('nav-link');
				$('#customize-button')	        .addClass('nav-link-selected');
				$('#home-button')		.removeClass('nav-link-selected');
				$('#gallery-button')	        .removeClass('nav-link-selected');
				$('#free-stuff-button')	        .removeClass('nav-link-selected');
				$('#testim-button')		.removeClass('nav-link-selected');
				
				$('#home-button')		.addClass('nav-link');
				$('#gallery-button')	        .addClass('nav-link');
				$('#free-stuff-button')	        .addClass('nav-link');
				$('#testim-button')		.addClass('nav-link');
				
				$('#cust-fr')			.removeClass('hidden');  	
			})
			
			$('#gallery-button').click(function(){
				$('#gallery-button')	        .removeClass('nav-link');
				$('#gallery-button')	        .addClass('nav-link-selected');
				$('#customize-button')	        .removeClass('nav-link-selected');
				$('#home-button')		.removeClass('nav-link-selected');
				$('#free-stuff-button')	        .removeClass('nav-link-selected');
				$('#testim-button')		.removeClass('nav-link-selected');
				
				$('#customize-button')	        .addClass('nav-link');
				$('#home-button')		.addClass('nav-link');
				$('#free-stuff-button')	        .addClass('nav-link');
				$('#testim-button')		.addClass('nav-link');
				
				$('#prodfr')			        .addClass('hidden'); 
				$('#cust-fr')		        .addClass('hidden'); 	
			})
			
			$('#free-stuff-button').click(function(){
				$('#free-stuff-button')	        .removeClass('nav-link');
				$('#free-stuff-button')	        .addClass('nav-link-selected');
				$('#customize-button')	        .removeClass('nav-link-selected');
				$('#gallery-button')	        .removeClass('nav-link-selected');
				$('#home-button')		.removeClass('nav-link-selected');
				$('#testim-button')		.removeClass('nav-link-selected');
				
				$('#customize-button')	        .addClass('nav-link');
				$('#gallery-button')	        .addClass('nav-link');
				$('#home-button')		.addClass('nav-link');
				$('#testim-button')		.addClass('nav-link'); 
				
				$('#prodfr')			        .addClass('hidden');
				$('#cust-fr')			.addClass('hidden'); 	
			})
			
			$('#testim-button').click(function(){
				$('#testim-button')		.removeClass('nav-link');
				$('#testim-button')		.addClass('nav-link-selected');
				$('#customize-button')	        .removeClass('nav-link-selected');
				$('#gallery-button')	        .removeClass('nav-link-selected');
				$('#free-stuff-button')	        .removeClass('nav-link-selected');
				$('#home-button')		.removeClass('nav-link-selected');
				
				$('#customize-button')	        .addClass('nav-link');
				$('#gallery-button')	        .addClass('nav-link');
				$('#free-stuff-button')	        .addClass('nav-link');
				$('#home-button')		.addClass('nav-link');
				
				$('#prodfr')			        .addClass('hidden'); 
				$('#cust-fr')			.addClass('hidden'); 	
			})
			
			$('#qp-select').click(function(){
				$('#prodfr')		                .removeClass('hidden');
				$('#cust-fr')			.addClass('hidden');
			})
		});

Code (markup):

now.......... there's GOT TO BE a simpler way to achieve what I created here... lol.... besides that I also noticed if you click on Customize then one of the other buttons the "Quick Pick" and "Optiqfy" buttons don't go away as I attempted to make them to with the addClass('hidden') on the cust-fr ID triggered with each button. Doing it this way I have to basically create the same exact thing over and over just to change one little element about it and tell the browser to do something that's already done... which is where the if n if else commands come in for things.... How can I go about applying that to make this smaller and achieve what I want to achieve with how I have it set up?

 

Here you go,
Not tested but should work and you will get the general idea.

var links = new Array( '#home-button', '#customize-button', '#gallery-button', '#free-stuff-button', '#testim-button' );


function SelectNavItem(item) {
    $('#' + item).removeClass('nav-link');
    $('#' + item).addClass('nav-link-selected');
    
    for (var i=0;i<links.length;i++) {
        if (links[i] != '#' + item) {
            $('#' + links[i]).removeClass('nav-link-selected');
            $('#' + links[i]).addClass('nav-link-selected');
        }
    }
    
    if (item == 'customize-button') {
        $('#cust-fr').removeClass('hidden');
    } else {
        $('#cust-fr').addClass('hidden');
    }
}


for (var i=0;i<links.length;i++) {
    $('#' + links[i]).bind('click', function() {
        SelectNavItem($(this).id);
    });
}

Code (markup):