var Tabs = 
{
	SelectedTab : null, // global scope for onclick function

	Load : function()
        {
		var tabs = document.getElementsByClassName('tab');

		var selectorList = document.createElement("ul");
		selectorList.className = "tab-list";
		tabs[0].parentNode.insertBefore(selectorList, tabs[0]);	

		for(var i = 0; i < tabs.length; i++)
		{
			var thisTab = tabs[i];
			document.addCssClass(thisTab, 'js-tab');
			var tabTitle = document.getChildElementsByClassName(thisTab, "tab-title")[0];

			var newLink = document.createElement("a");
			newLink.href = "#" + thisTab.id;
			newLink.appendChild(document.createTextNode(tabTitle.innerHTML))
			tabTitle.style.display = "none";

			var newListItem = document.createElement("li");
			newListItem.appendChild(newLink);
			selectorList.appendChild(newListItem);

			newLink.tab = thisTab; // dynamic attribute creation
			thisTab.SelectorLink = newLink;
			
			if(thisTab == tabs[0])
			{
				newLink.className = "selected";
				thisTab.style.display = "block";
				Tabs.SelectedTab = thisTab;
			}
			else
			{
				thisTab.style.display = "none";
			}
		
			newLink.onclick = function()
			{
				Tabs.SelectedTab.style.display = "none";
				Tabs.SelectedTab.SelectorLink.className = "";

				this.tab.style.display = "block";
				this.className = "selected";

				Tabs.SelectedTab = this.tab;
				return false;
			}

		}
        }
}

window.addToOnload(Tabs.Load);

