Dlaczego to nie działa na firefoxie? JS CSS

czesc stworzyłem pewne menu rozwijane, na google chrome ładnie śmiga zaś na firefoxie juz nie chce dzialac

kodzik: 

<script type="text/javascript">
$(document).ready(function(){
    $('#open-menu').click(function()
    {$('.menu-is-open').toggle('3000')})})</script>  

CSS:

.button-menu
{
    position: absolute;
    top: 25px;
    right: 35px;
    border: none;
    background-color: transparent;
    outline: none;
    cursor: pointer;
}

.menu-is-open
{
    display: none;
    position: absolute;
    top: 60px;
    right:-25px;
    box-sizing: border-box;
    z-index: 9998;
}

.menu-is-open a
{
    margin-bottom: 20px;
    display: block;
    text-decoration: none;
    color: #000000;
    transition: 0.2s;
    cursor: pointer;
    font-family: 'Josefin Sans', sans-serif;
    z-index: 9997;
}

.menu-is-open a:hover
{
    color:#fff6f6;
}

HTML: 

<button type="button" class="button-menu"><img id="open-menu" src="img/hamburger-icon2.png" alt="MENU"/><div class="menu-is-open"><a href="#"><img src="img/user-icon.png" alt="user-icon"/> MOJE_KONTO</a><a href="#"><img src="img/logout-icon.png" alt="logout-icon"/>WYLOGUJ_SIĘ</a></div></button></header>

Pomocy :D