HTML

<div class="tabArea">
    <ul class="tab">
        <li><a href="#tab1">tab1</a></li>
        <li><a href="#tab2">tab2</a></li>
    </ul>
    <div id="tab1" class="tabPanel">
        tab1tab1tab1tab1tab1tab1tab1<br />
        tab1tab1tab1tab1tab1tab1tab1<br />
        tab1tab1tab1tab1tab1tab1tab1<br />
        tab1tab1tab1tab1tab1tab1tab1<br />
        tab1tab1tab1tab1tab1tab1tab1<br />
        tab1tab1tab1tab1tab1tab1tab1
    </div>
    <div id="tab2" class="tabPanel">
        tab2tab2tab2tab2tab2tab2tab2<br />
        tab2tab2tab2tab2tab2tab2tab2<br />
        tab2tab2tab2tab2tab2tab2tab2<br />
        tab2tab2tab2tab2tab2tab2tab2<br />
        tab2tab2tab2tab2tab2tab2tab2<br />
        tab2tab2tab2tab2tab2tab2tab2
    </div>
</div>

Script

jQuery(function($){
	var tabArea = $('div.tabArea');
	var tabPanel = $('div.tabPanel',tabArea);
	var tab = $('ul.tab li',tabArea);
	
	tabPanel.not(':first').hide();
	
	tab.eq(0).addClass('active');
	tab.click(function(){
		var targetTabId = $('a',this).attr('hash');
		
		tab.removeClass('active');
		tabPanel.hide();
		$(this).addClass('active');
		$(targetTabId).show();
		
		return false;
	});
});

Demo

tab1tab1tab1tab1tab1tab1tab1
tab1tab1tab1tab1tab1tab1tab1
tab1tab1tab1tab1tab1tab1tab1
tab1tab1tab1tab1tab1tab1tab1
tab1tab1tab1tab1tab1tab1tab1
tab1tab1tab1tab1tab1tab1tab1
tab2tab2tab2tab2tab2tab2tab2
tab2tab2tab2tab2tab2tab2tab2
tab2tab2tab2tab2tab2tab2tab2
tab2tab2tab2tab2tab2tab2tab2
tab2tab2tab2tab2tab2tab2tab2
tab2tab2tab2tab2tab2tab2tab2