[jQuery] Re: add/removeClass problem

[yellowboy]

yellowboy wrote:
> 
> Problem:
> I have two divs, each containing tab navigation. When I click tab
> navigation items they receive class 'selected' while the previously
> clicked tab anchors retain 'selected' class as well. 
> 
> My intention is that with click of tab, other tabs drop the selected
> class. 
> 
> jquery:
> 
> $(function () {
>  $('div.tabs').each(function () {
>   var tabContainers = $('> div', this);
> 
>   $('ul.tabNavigation a', this).click(function () {
>     tabContainers.hide().filter(this.hash).show();
>         $('ul.tabNavigation a', this).removeClass('selected');
>     $(this).addClass('selected');
>         return false;
>   }).filter(':first').click();
>  });
> });
> 
> 
> html:
> 
> <div>
> <h2> # Photography </h2>
> 
> <div class="gallery">
> 
> <div class="tabs">
> <ul class="tabNavigation">
> <li> #first Alternative Process </li>
> <li> #second Black &amp; White </li>
> <li> #third Digital </li>
> </ul>
>            
> <div id="first">                                
> <ul class="altpro">
> <li> /imgs/main/ap1b.jpg </li>
> <li> /imgs/main/ap1b.jpg </li>
> <li> /imgs/main/ap1b.jpg </li>
> </ul>                                           
> </div><!--end first-->
> 
> <div id="second">                     
> <ul class="bandw">
> <li> /imgs/main/perf1.jpg </li>
> <li> /imgs/main/perf2.jpg </li>
> <li> /imgs/main/perf3.jpg </li>
> </ul>                                 
> </div><!--end second -->
> 
> <div id="third">                     
> <ul class="digclr">
> <li> /imgs/main/perf1.jpg </li>
> <li> /imgs/main/perf2.jpg </li>
> <li> /imgs/main/perf3.jpg </li>
> </ul>                                 
> </div><!--end third-->
> 
> </div><!--end tabs-->
> </div><!--end gallery-->
> 
> </div><!--end photography-->
> 
> Thanks! 
> 
> 

-- 
View this message in context: 
http://www.nabble.com/add-removeClass-problem-tp19536474s27240p19544783.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.