[jQuery] Customizing Gaile Carousel: hover and click conflict

[strangeplant]

I've customized Agile Carousel (I'm using JQuery 1.2.6) to fit what I
need, that is a single slide that rotates with a row of associated
buttons. In the unaltered state, I can click on a button, the slide
show will stop and show the correct slide. Now, when I add a hover
function, the correct slide shows, but the button class is messed up
so it will never show again, and the click no longer works. I've
worked on the hover function until I'm crazy. css only controls the
images for the button rollovers and to show which button is selected
during the slide show, so I guess the hover class for that element is
removed. Any ideas on how to approach this? The click is in a each
loop:

                // functions for clicking slide buttons
                $("#slide_buttons li").each(function() {
                    // add click functionality to buttons
                    $(this).click(function() {
                        button_class = $(this).attr("class");
                        change_button_class(button_class);
                        // declare next_slide_id_number
                        split_button_class_string = button_class.split
("_");
                        button_class_string =
split_button_class_string.pop();
                        next_slide_id_number = parseFloat
(button_class_string);
                        pause();
                        skip(next_slide_id_number);
                        return (false);
                    }); // click
                                }); //each

so the usual approach of:


                $("#slide_buttons li").removeClass('clicked');
                $(this).addClass('clicked');

will not work unless I put this in the hover function, and that
doesn't work there either.

Ideas? I also have other problems with Agile Carousel.