$(document).ready(function(){
	$(".menu > li").click(function(e){
		switch(e.target.id){
			case "projects1":
				// change status & style menu
				$("#projects1").addClass("active");
				$("#projects2").removeClass("active");
				$("#projects3").removeClass("active");
				$("#projects4").removeClass("active");
				$("#projects5").removeClass("active");
				$("#projects6").removeClass("active");
				$("#projects7").removeClass("active");
				
				// display selected division, hide others
				$("div.projects1").css("display", "block");
				$("div.projects2").css("display", "none");
				$("div.projects3").css("display", "none");
				$("div.projects4").css("display", "none");
				$("div.projects5").css("display", "none");
				$("div.projects6").css("display", "none");
				$("div.projects7").css("display", "none");
				break;
			
			case "projects2":
				// change status & style menu
				$("#projects1").removeClass("active");
				$("#projects2").addClass("active");
				$("#projects3").removeClass("active");
				$("#projects4").removeClass("active");
				$("#projects5").removeClass("active");
				$("#projects6").removeClass("active");
				$("#projects7").removeClass("active");
				
				// display selected division, hide others
				$("div.projects2").css("display", "block");
				$("div.projects1").css("display", "none");
				$("div.projects3").css("display", "none");
				$("div.projects4").css("display", "none");
				$("div.projects5").css("display", "none");
				$("div.projects6").css("display", "none");
				$("div.projects7").css("display", "none");
				break;
			
			case "projects3":
				// change status & style menu
				$("#projects1").removeClass("active");
				$("#projects2").removeClass("active");
				$("#projects3").addClass("active");
				$("#projects4").removeClass("active");
				$("#projects5").removeClass("active");
				$("#projects6").removeClass("active");
				$("#projects7").removeClass("active");
				
				// display selected division, hide others
				$("div.projects3").css("display", "block");
				$("div.projects1").css("display", "none");
				$("div.projects2").css("display", "none");
				$("div.projects4").css("display", "none");
				$("div.projects5").css("display", "none");
				$("div.projects6").css("display", "none");
				$("div.projects7").css("display", "none");
				break;

            case "projects4":
                // change status & style menu
                $("#projects1").removeClass("active");
                $("#projects2").removeClass("active");
                $("#projects3").removeClass("active");
                $("#projects4").addClass("active");
                $("#projects5").removeClass("active");
                $("#projects6").removeClass("active");
                $("#projects7").removeClass("active");

                //display selected division, hide others
                $("div.projects4").css("display", "block");
                $("div.projects1").css("display", "none");
                $("div.projects2").css("display", "none");
                $("div.projects3").css("display", "none");
                $("div.projects5").css("display", "none");
                $("div.projects6").css("display", "none");
                $("div.projects7").css("display", "none");
                break;

            case "projects5":
                // change status & style menu
                $("#projects1").removeClass("active");
                $("#projects2").removeClass("active");
                $("#projects3").removeClass("active");
                $("#projects4").removeClass("active");
                $("#projects5").addClass("active");
                $("#projects6").removeClass("active");
                $("#projects7").removeClass("active");

                // display selected division, hide others
                $("div.projects5").css("display", "block");
                $("div.projects1").css("display", "none");
                $("div.projects2").css("display", "none");
                $("div.projects3").css("display", "none");
                $("div.projects4").css("display", "none");
                $("div.projects6").css("display", "none");
                $("div.projects7").css("display", "none");
                break;

            case "projects6":
                // change status & style menu
                $("#projects1").removeClass("active");
                $("#projects2").removeClass("active");
                $("#projects3").removeClass("active");
                $("#projects4").removeClass("active");
                $("#projects5").removeClass("active");
                $("#projects6").addClass("active");
                $("#projects7").removeClass("active");

                // display selected division, hide others
                $("div.projects6").css("display", "block");
                $("div.projects1").css("display", "none");
                $("div.projects2").css("display", "none");
                $("div.projects3").css("display", "none");
                $("div.projects4").css("display", "none");
                $("div.projects5").css("display", "none");
                $("div.projects7").css("display", "none");
                break;

            case "projects7":
                // change status & style menu
                $("#projects1").removeClass("active");
                $("#projects2").removeClass("active");
                $("#projects3").removeClass("active");
                $("#projects4").removeClass("active");
                $("#projects5").removeClass("active");
                $("#projects6").removeClass("active");
                $("#projects7").addClass("active");

                // display selected division, hide others
                $("div.projects7").css("display", "block");
                $("div.projects1").css("display", "none");
                $("div.projects2").css("display", "none");
                $("div.projects3").css("display", "none");
                $("div.projects4").css("display", "none");
                $("div.projects5").css("display", "none");
                $("div.projects6").css("display", "none");
                break;
		}

		return false;
	});
});

