[jQuery] toggle and logic confusion

[jQuery] toggle and logic confusion

<html>
<body>
Hi folks,
I have a set of 3 divs with a class element of
"hideme".   Through the code that follows (it's not
mine; it works!), I can click a dedicated a.tag for each div to toggle
the visibility (or not) of the contents of the associated div.
What I'd like to be able to achieve is that if say, div#1 was visible and
the user clicked the a tag for div#2, then div#1 would disappear and
div#2 appear in its place.
The code in the inserted line #5 allows me to achieve this slightly, but
it requires the associated a tag link to be double clicked in order for
their associated div to become visible and the currently visible div to
be hidden.
I'd appreciate someone illuminating a path to a solution for me.
Thanks/Bruce
<tt>1   
$('#fsheet').find('.hideme').hide().end();<x-tab> </x-tab><x-tab>
        </x-tab><x-tab>
        </x-tab>
2    $('a.showme').each(function(i) {
3<x-tab>       </x-tab><x-tab>
        </x-tab>var $match =
$('div.hideme').eq(i);<x-tab>     </x-tab><x-tab>
        </x-tab><x-tab>
        </x-tab><x-tab>
        </x-tab>
4<x-tab>       </x-tab><x-tab>
        </x-tab>
$(this).toggle(function() {
5<x-tab>       </x-tab>//<x-tab>
      </x-tab><x-tab>
        </x-tab>
$('div.hideme:not(eq(i))').hide('slow');
6<x-tab>       </x-tab><x-tab>
        </x-tab><x-tab>
        </x-tab>
$match.show('slow');<x-tab>    </x-tab>
7<x-tab>       </x-tab><x-tab>
        </x-tab><x-tab>
        </x-tab>}, function ()
{
8<x-tab>       </x-tab><x-tab>
        </x-tab><x-tab>
        </x-tab>
$match.hide('slow');
9<x-tab>       </x-tab><x-tab>
        </x-tab><x-tab>
        </x-tab>}
10<x-tab>      </x-tab><x-tab>
        </x-tab>);
11    }); </tt> </body>
</html>