/*
Sample HTML structure
---------------------
<div class="tabsContainer">
	<div id="tab1" class="unselected" style="display: none">
		Tab 1
	</div>
	<div id="tab2" class="unselected" style="display: none">
		Tab 2
	</div>
	<div class="SwitchingRegions">
		<div id="tabContainer1" style="display: none">
			tab 1 content
		</div>
		<div id="tabContainer2" style="display:none;">
			tab 2 content
		</div>
	</div>
</div>

jQuery code sample
------------------
$(".tabs-wrapper").pmTabs();
*/

(function($) {
    $.fn.extend({
        pmTabs: function() {
			return this.each(function() {
				//	Tab container 
				var oTabContainer = $(this);
				
				var tabIsActive = false;
				
				oTabContainer.find("div[id^='tabContainer']").each(function(){
					oTabContentContainer = $(this);
				
					if ($.trim(oTabContentContainer.html()).length > 0) {
						var strTabId = oTabContentContainer.attr("id");
						strTabId = strTabId.substring(12, strTabId.length);
						
						oTab = $("#tab" + strTabId);
						
						//	Show tab
						oTab.show();
						
						//	Select first tab with content
						if (!tabIsActive) {
							oTab.removeClass().addClass("selected");
							oTabContentContainer.show();	
							
							tabIsActive = true;
						}
						
						//	Handle tab events
						oTab.click(function(e) {
							oTab = $(this);
						
							oTabContainer = oTab.parents("div[class*='Container']");
							oTabContentContainer = oTabContainer.find("div[id^='tabContainer" + strTabId + "']");
							
							oTabContainer.children("div[class$='selected']").removeClass().addClass("unselected");
							//oTab.siblings().removeClass().addClass("unselected");
							oTabContainer.find("div[id^='tabContainer']").hide();
							
							oTab.removeClass().addClass("selected");
							oTabContentContainer.show();
						});	
					}															   
				});
			});
		}
    });
})(jQuery);