// Set the current item token, and the on-load token to default		
var current_token = load_token = 'first'; 
$(document).ready(function() { 
	// Get the on-load token from the URL 
	var loc = document.location.href;
	var pound_index = loc.indexOf("#");
	if (pound_index != -1) {
		load_token = loc.substring(pound_index + 1, loc.length);
	}
 
	$('.content').hide(); // Hide everything
	$('#'+load_token).show(); // Show the on-load content
 
	$('.switch').click(function() {
	 	// Get the token to switch to from the link id
		var this_id = $(this).attr('id');
		var underscore_index = this_id.indexOf("_");
		var on = this_id.substring(underscore_index + 1, this_id.length);
		if (current_token != on) { // Only if the user is actually switching
			$('.content').hide(); // Hide everything
			$('#'+on).show(); // Show the desired content
			location.href = '#'+on; // Set the URL so it's bookmarkable
			current_token = on;
		}
	});
});

<div id="nav"> 
	<ul> 
		<li><a href="#first" class='switch' id='top_first'>first</a></li> 
		<li><a href="#second" class='switch' id='top_second'>second</a></li> 
		<li><a href="#third" class='switch' id='top_third'>third</a></li> 
		<li><a href="#fourth" class='switch' id='top_fourth'>fourth</a></li> 
	</ul> 
</div> 
<div id="first" class='content'>one one one</div> 
<div id="second" class='content'>two two two</div> 
<div id="third" class='content'>three three three</div> 
<div id="fourth" class='content'>four four four</div>