Having an issue trying to devellop sidebar navigation

Having an issue trying to devellop sidebar navigation

Hi,
I´m trying to understand how to do a navigation side bar for mobile and tablet devices.
I found a tutorial that explains how to do a basic one, and I did everything like the author of the tutorial but its not working fine with me.
Somebody there see something wrong in the code?

My fiddle with the issue:

http://jsfiddle.net/ritz/th46k/1/

Html:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<nav id="menu-containerr">
<div id="menu">
        <ul>
            <li><a href="#">Menu Item 1</a></li>
            <li><a href="#">Menu Item 2</a></li>
            <li><a href="#">Menu Item 3</a></li>
        </ul>
</div>
    <div id="right">
        <div id="menubar">
            <div id="button">
                Menu
            </div>
        </div>
          
    </div>
</nav>

jQuery:

$('#button').toggle( 
    function() {
        $('#right').animate({ left: 250 }, 'slow', function() {
            $('#button').html('Close');
        });
    }, 
    function() {
        $('#right').animate({ left: 0 }, 'slow', function() {
            $('#button').html('Menu');
        });
    }
);