Kan du ikke gøre noge i stil med dette:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<title>Untitled</title>
<style type="text/css">
<!--
.hide {
display:none;
}
.show {
display:block;
}
-->
</style>
<script type="text/javascript">
function getID(_id) {
if (document.getElementById)
return document.getElementById(_id);
else
if (document.all)
return document.all[_id];
}
function setClass(_id, _class) {
var obj;
obj=getID(_id);
if (obj) {
obj.className=_class;
}
}
function setHideAll(_id) {
var elements=document.getElementById(_id).getElementsByTagName("div");
if (elements) {
for (var i = 0; i < elements.length; i++) {
if (/show/.test(elements[i].className)) {
elements[i].className = 'hide';
}
}
}
}
</script>
</head>
<body>
<div id="main">
<div id="ob1"><a href="#" onclick="setHideAll('main'); setClass('ib1', 'show');">Outer box 1</a>
<div id="ib1" class="hide">Inner Box 1</div>
</div>
<div id="ob2"><a href="#" onclick="setHideAll('main'); setClass('ib2', 'show');">Outer box 2</a>
<div id="ib2" class="hide">Inner Box 2</div>
</div>
<div id="ob3"><a href="#" onclick="setHideAll('main'); setClass('ib3', 'show');">Outer box 3</a>
<div id="ib3" class="hide">Inner Box 3</div>
</div>
<div id="ob4"><a href="#" onclick="setHideAll('main'); setClass('ib4', 'show');">Outer box 4</a>
<div id="ib4" class="hide">Inner Box 4</div>
</div>
</div>
</body>
</html>