jquery stop mouseover event after click event

Question

can someone help me with this

I am trying to set a different color for the element from the click event.

The problem is that the mouseover event makes everything white again. So, I will never get to see the color off the active(actief)class.

What could I do, I already try'd putting in the line stopevent propagation()??

thanks, Richard

$("#tbestel_opties2 span").live("mouseover", function() {
            $t=$(this);
            if(!$t.hasClass('actief')){

                $t.css({'color':'#fff','backgroundColor':'#fdc601'}); 
            }
        });
        $("#tbestel_opties2 span").live("mouseout", function() {
                $t=$(this);
                if(!$t.hasClass('actief')){
                $t.css({'color':'#333','backgroundColor':'#fdc601'});                                                                          }
        });

        $("#tbestel_opties input,#tbestel_opties2 span").live("click", function(e)
        {e.stopPropagation(); 
            $t=$(this);
              $('#tbestel_opties2 .actief').removeClass("actief").css({'color':'#333'});

             $t.addClass("actief")

            $("#opties li:eq(0)").addClass("actief");


    }); 

Answer 1

Use a class instead. When an element is clicked, add another class to the element. Make sure this class is not set before you do anything in mouseover/out. This also has the advantage of allowing you to move the styling of the clicked elements into your CSS if you wish.