You need to reset the function
you want to fire on("mouseover")
function setHover(){
$('.element')
.css({'outline':'none'})
.off('mouseover mouseleave click')
.on({
mouseover: function(){
$(this).css({'outline':'2px dashed red'});
},
mouseleave: function(){
$(this).css({'outline':'none', background: '#CCC'});
},
click: function(){
$('.element').off('mouseover mouseleave click');
$(this).css({'outline':'2px solid #369fe4'});
}
});
}
$('#button').click(function(){
setHover();
});
setHover();