[hothousegraphix]

I'm using a tab script I ran across that works only if I remove the portion of the function that removes the "active" class on the active tab when a new tab is selected.

The script requires prototype.

var visibleTabContent = 'one';
function switchTabs(ulId, clickedListItem, clickedListItemsDivId) {
  if (!$(clickedListItemsDivId).visible()) {
    $(visibleTabContent).hide();                                             //hide the DIV contents for the old tab
    $(ulId).select('li.active').invoke('removeClassName', 'active'); //remove the "active_tab" class from the old tab
    $(clickedListItem.id).addClassName('active');                        //add the "active" class to the new tab
    $(clickedListItemsDivId).show();                                         //show the DIV contents for the new tab
    visibleTabContent = clickedListItemsDivId;                               //save the name of the active tab for future reference
  }
}

IF I remove

 $(ulId).select('li.active').invoke('removeClassName', 'active');

The tab selection functions; however, as one might guess, it's not shifting the "active" style from tab to tab, it's simply assigning it.

I've tried doing

 $(ulId).select('li.active').removeClassName('active');

sinse "removeClassName" is a prototype function, but it delivers the same results.

Error: $(ulId).select is not a function ???

The accompanying mark-up is

<ul id="tabs_menu" class="margin_20 clearfix">

	<li  id="cat1" class="active" onclick="switchTabs('tabs_menu', this, 'one')">Cat 1 +</li>
	<li  id="cat2" onclick="switchTabs('tabs_menu', this, 'two')">Cat 2 +</li>
	<li  id="cat3" onclick="switchTabs('tabs_menu', this, 'three')">Cat 3 +</li>
</ul>
<div id="one">
	<!--Content Here-->
</div>
<div id="two">
	<!--Content Here-->
</div>
<div id="three">
	<!--Content Here-->
</div>

Any advice?

Thanks