如何控制鼠标事件？当处于down时会触发其他效果，而up的时候则会取消所有效果?

点击的时候，按钮会变橙色，松开变回白色。处于点击状态时，离开会变回白色，进去又为橙色。
但松开后，离开和进入的效果被保存到css了。
怎么让完成一次点击事件后，无效掉进入与退出的效果。

    $(".bottom .button").on({
        mousedown:function(){
            $(this).css("background-color","#FD9917").css("color","white")
                .on({
                    mouseenter:function(){
                        $(this).css("background-color","#FD9917").css("color","white")},
                    mouseleave:function(){
                        $(this).css("background-color","white").css("color","black")}
                })
        },
        mouseup:function(){
            $(this).css("background-color","white").css("color","black")
        }
    })