Проблемы с открытой панелью

Я пытаюсь открыть панель с помощью jQuery Mobile.

Панель должна лежать слева и нажимать страницу, но кажется, что панель накладывается на всю ее сторону.

В консоли я получаю сообщение об ошибке:

Uncault Error: не может вызывать методы на панели до инициализации; попытался вызвать метод 'open'

Мой HTML:

    <div data-role="page">
        <div data-role="header">
            <header>
                <div id="header">
                    <a href="#menue_panel" id="menu-btn" class="ui-btn ui-btn-icon-notext ui-corner-all ui-icon-bars ui-nodisc-icon ui-alt-icon ui-btn-left">Menu</a>
                    <h1 id="headline">Text</h1>
                    <div class="clean"></div>
                </div>
            </header>
        </div>
    </div>
    <footer>
    </footer>
    <div data-role="panel" id="menue_panel" data-position="left" data-display="push">
        <ul class="ui-alt-icon ui-nodisc-icon">
            <li><a href="start.html" data-ajax="false">Startseite</a></li>
            <li><a href="medis.html" data-ajax="false">Medikamente</a></li>
        </ul>
    </div>   

Мой JS

$( document ).ready(function() {
    $( "#menu-btn" ).on( "click", function() {
            $( "#menue_panel" ).panel( "open" );
    });    
});

Я не знаю, почему это не работает.