画面遷移させず要素をシンプルにタブで切り替える仕組みをjQueryだけでつくります。

デモページ

JavaScript

(function($){
	$(function() {
		
		$('.tabSection .content:not(:first)').hide();
		
		$('.tabSection .tab li').click(function() {
			$('.tabSection .tab li').removeClass('current');
			$(this).addClass('current');
			$('.tabSection .content').hide();
			var select = $(this).find('a').attr('href');
			$(select).show();
			return false;			
		});
		
	});
})(jQuery);

HTML

<div class="tabSection">
	<ul class="tab">
		<li class="current"><a href="#tab01">tab01</a></li>
		<li><a href="#tab02">tab02</a></li>
		<li><a href="#tab03">tab03</a></li>
	</ul>
	<div id="tab01" class="content">
		<p>tab01 content</p>
	</div>
	<div id="tab02" class="content">
		<p>tab02 content</p>
	</div>
	<div id="tab03" class="content">
		<p>tab03 content</p>
	</div>
</div>

デモページ