Hi Anton,
$('#gt').click(function() { //<-- # this is wrong, you don't have a gt #id
but a gt.class so you have to change #gt in .gt
$(this).removeClass("gt");
$(this).addClass("gt_active");
});
this should work:
$('.gt').click(function() {
$(this).removeClass("gt");
$(this).addClass("gt_active");
});
try it,
regards
Diego
2008/10/30 Anton Babushkin <[EMAIL PROTECTED]>
>
> 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!
>
