Pestaña activa en menú

[hakender]

Hola a todos! Estoy haciendo un menú de pestañas con HTML, CSS y JavaScript.

Tengo este HTML:


<ul class="tabmenu">
<li><a href="javascript:void(0)" onclick="tabs('1');changeActiveStates(this)" id="link1">Informaci&oacute;n</a></li>
<li><a href="javascript:void(0)" onclick="tabs('2');changeActiveStates(this)" id="link2">Mapas</a></li>
<li><a href="javascript:void(0)" onclick="tabs('3');changeActiveStates(this)" id="link3">Fotos</a></li>
<li><a href="javascript:void(0)" onclick="tabs('4');changeActiveStates(this)" id="link4">C&oacute;mo llegar</a></li>
</ul>


A esto le agregué un poco de CSS para el estilo y las siguientes líneas en javascript:


<script type="text/javascript">
function tbs(id){
return document.getElementById(id);
}

function tabsen(){
tbs("1").style.display = "none";
tbs("2").style.display = "";
tbs("3").style.display = "";
tbs("4").style.display = "";
}

function tabs(id) {
tabsen();
var e = tbs(id);
e.style.display = ( e.style.display == '' ) ? 'block' : '' ;
}

function byId(id) {
return document.getElementById ? document.getElementById(id) : document.all[id];
}
var prevLink = "";
function changeActiveStates(ele) {
if (prevLink) byId(prevLink).className = "";
ele.className = 'active';
prevLink = ele.id;
}
</script>


El problema es que no sé cómo hacer para que la primera pestaña aparezca activa al abrirse la página. Ya probé con ponerle class='active', pero aunque así aparece activa, al clickear sobre otra pestaña la primera no se desactiva. Solamente al cliquear sobre la primera y después sobre otra ahí sí se desactiva.

Alguien puede ayudarme? :S

[Artificium]

Bueno, en tu código veo cosas que pueden mejorarse, como el uso de dos funciones, se puede hacer solo con una, pero en todo caso, debes definir la variable global prevLink dandole el valor de 0 por defecto.