Bootstrap mobile button not expanding

When it shows up at 768px, my button isn't dropping down with my menu. I have .menu targeted by the <button>.

<header class="navbar navbar-default">
    <a class="navbar-brand" href="#">Binary Elegance</a>
    <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".menu">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </button>
    <div class="collapse navbar-collapse menu">
        <ul class="nav navbar-nav navbar-right">
            <li><a href="#">foobar1</a></li>
            <li><a href="#">foobar2</a></li>
            <li><a href="#">foobar3</a></li>
            <li><a href="#">foobar4</a></li>
            <li><a href="#">foobar5</a></li>
            <li><span id="lang-dropdown"></span><span id="arrow-dropdown"></span></li>
        </ul>
    </div>
</header>