Coding Cookbook/Tabbar

Dynamic HTML solution
 window.onload = function { activatePage("Pagelet1"); } function activatePage(sSectionName) { var nodeElem = document.getElementById("li"+sSectionName); var nodeList = nodeElem.parentNode.parentNode.childNodes; for (var i = 0; i < nodeList.length; i++) { var node = nodeList[i]; if (node.nodeName == "LI") { node.childNodes[0].className = ""; var nodeDiv = document.getElementById("div" + node.childNodes[0].id.substr(2)); nodeDiv.style.display = "none"; }     }    document.getElementById("div"+sSectionName).style.display = ""; document.getElementById("li"+sSectionName).className = "active"; document.getElementById("li"+sSectionName).blur; } UL.tabbar {margin: 0; margin-top: 1em; margin-bottom: 3px; padding: 0; padding-left: 1em; line-height: 19px;} UL.tabbar LI {display: inline; white-space: nowrap; } UL.tabbar A {border: solid 1px silver; background-color: rgb(238,238,238); padding: 3px 1em 6px 1em; position: relative; z-index: 1;} UL.tabbar A.active {border-bottom-color: white; background-color: white;} .pagelet {border: solid 1px silver; padding: 1em;}   Pagelet 1  Pagelet 2  foo bar