$(document).ready(function(){

	// bind clicks on links
	var bindClickLinks = function() {

		$('#mediaNav a').each(

			// For each item, bind the onclick behavior.
			function() {

				// Bind the onclick event 
				$(this).click(
					function() {
						
						var theId = $(this).attr('id'); // get ID of clicked element
						
						// clear right column
						$('#rightCol').html('');
						$('#middleColAjax').html('');
						
						// hide all areas
						$('#mediaMusicWrap').hide();
						$('#mediaPicturesWrap').hide();
						$('#mediaVideoWrap').hide();

						// show selected area
						$('#media' + theId + 'Wrap').show();

						return false; // return false so the link doesn't actually click anywhere

					}
				);
			}
		);
	};
	
	// bind onclick events on initial pageload
	bindClickLinks();

});
