You should be attaching your click bind to the anchor element not the
list element, since thats whats going to be firing the event.
On Oct 30, 1:18 pm, Info <[EMAIL PROTECTED]> wrote:
> Hello All,
> I have a CSS list that I use as my navigation. Each LI has a
> background image as the base and a a:hover image for roll over. Within
> the LI item for the navaigation I have a ahref that is used to fire
> off some jquery function. All this works....now I want to change the
> LI item to another css class if it clicked. I have tried this:
>
> $('#gt').click(function() {
> $(this).removeClass("gt");
> $(this).addClass("gt_active");
> });
>
> But that doesn't work :-(
>
> Here is a sample of the complete code:
>
> HTML
> <div class="order_menu">
> <ul>
> <li class="gt"><a href="#1" class="cross-link"></a></
> li>
> <li class="lt"><a href="#2" class="cross-link"></a></
> li>
> <li class="pt"><a href="#3" class="cross-link"></a></
> li>
> </ul>
> </div>
>
> CSS:
>
> #main_container #left_container .mid_outer .slide_outer .order_menu
> li.gt a{float:left; width:235px; height:54px; background:url(../images/
> gt.jpg) no-repeat top left;}
>
> #main_container #left_container .mid_outer .slide_outer .order_menu
> li.gt a:hover{background:url(../images/gt_over.jpg) no-repeat top
> left;}
>
> #main_container #left_container .mid_outer .slide_outer .order_menu
> li.gt_active{float:left; width:235px; height:54px; background:url(../
> images/gt_over.jpg) no-repeat top left;}
>
> Any help would be great!
