var active = "tabtrigger1";

function initToggle() {
	$(".tabtrigger").click(
		function() {
			document.getElementById(active).parentNode.parentNode.id = "";
			this.parentNode.parentNode.id = "active";
			
			// HIDE SHOWING
			switch(active) {
				case "tabtrigger1":
					$("#tab1").css({ display: "none" });
					break    
				case "tabtrigger2":
					$("#tab2").css({ display: "none" });
					break
				case "tabtrigger3":
					$("#tab3").css({ display: "none" });
					break    
				case "tabtrigger4":
					$("#tab4").css({ display: "none" });
					break
				default:
			}
			
			// NEW ACTIVE TAB
			active = this.id;
			
			// SHOW HIDING
			switch(active) {
				case "tabtrigger1":
					$("#tab1").css({ display: "block" });
					break    
				case "tabtrigger2":
					$("#tab2").css({ display: "block" });
					break
				case "tabtrigger3":
					$("#tab3").css({ display: "block" });
					break    
				case "tabtrigger4":
					$("#tab4").css({ display: "block" });
					break
				default:
			}
			
			return false;
		}
	);
}

$(document).ready(function() {
	$("#tab2").css({ display: "none" });
	$("#tab3").css({ display: "none" });
	$("#tab4").css({ display: "none" });
	initToggle();
});