Firefox/IE jQuery is(":hover") not working

Question

http://jsfiddle.net/h8rxa3pj/2/

$("#open_link").hover(function() {
    $("#menu").removeClass("hidden");
},function() {
    if ($("#menu").is(":hover")) {
        $("#menu").mouseleave(function() {
            $("#menu").addClass("hidden");
        });
    }
    else {
        $("#menu").addClass("hidden");
    };
});

I have looked at the other questions on this and tried pretty much every solution except the ones I couldn't understand.

How do I check if the mouse is over an element in jQuery?

I feel like Arthur's answer could help but I'm really new to jQuery/JS and I don't know how to apply it here. Help appreciated

Answer 1

$("#open_link, #menu").hover(function() {
    $("#menu").removeClass("hidden");
});
$("#open_link, #menu").mouseleave(function() {
    $("#menu").addClass("hidden");
});