FBJS addClassName removeClassName not working

I'm trying to add and remove classes to tabs when people click on them. This is what I have right now and it does absolutely nothing..!

<script> 
<!-- 
function toggleClasses() {
   tab1 = document.getElementById("tab1");
   tab2 = document.getElementById("tab2");
   tab3 = document.getElementById("tab3");
   tab4 = document.getElementById("tab4");

   tab1.removeClassName("bstTabSelected").addClassName("bstTab");
   tab2.removeClassName("bstTabSelected").addClassName("bstTab");
   tab3.removeClassName("bstTabSelected").addClassName("bstTab");
   tab4.removeClassName("bstTabSelected").addClassName("bstTab");

}
//--> 
</script>

I'm calling it with:

<a href="#" id="tab1" onclick="toggleClass()" class="bstTabSelected" clicktoshow="tab1" clicktohide="tab2,tab3,ta开发者_C百科b4">Tab 1</a>

I can't seem to figure it out.. thanks!

You function is named toggleClasses (plural) where your click event calls toggleClass (singular)

EDIT

Are you using Firefox and Firebug? FBJS doesn't ovewrite the console, which is super handy. Make sure your function is running at all

function toggleClasses()
{
  console.log( 'Hello from toggleClasses!' );
}