Firefox OS get selection from drawer with Building Blocks

Question

I am trying to do a drawer menu for in my Firefox OS app, based in the Bulding Blocks from Firefox team:

http://buildingfirefoxos.com/building-blocks/drawer.html

At the moment I have a menu button that show and hide the menu, but I can not change to other page when the user click in a different item in the menu.

With this code I can see the Page 1 when the app start, but the page2 is no loaded when I select the button "page 2" in the menu

<section id="index" data-position="current">
    <section data-type="sidebar">
    <header>
        <menu type="toolbar" />
        <a href="#"></a>
        </menu>
        <h1>My Menu</h1>
    </header>
    <nav>
        <ul>
            <li>
                <a href="#page1">page 1</a>
            </li>
            <li>
                <a href="#page2">page 2</a>
            </li>
        </ul>
    </nav>
</section>

<!-- Page 1 -->
<section id="drawer" class="skin-dark" role="region">
    <header class="fixed">
        <a href="#"><span class="icon icon-menu">hide sidebar</span></a>
        <a href="#drawer"><span class="icon icon-menu">show sidebar</span></a>
        <h1>Page 1</h1>
    </header>
    <article class="content scrollable header">
        <section id="page1_list" data-type="list"></section>
    </article>
</section>

<!-- Page 2 -->
<section id="drawer" class="skin-dark" role="region">
    <header class="fixed">
        <a href="#"><span class="icon icon-menu">hide sidebar</span></a>
        <a href="#drawer"><span class="icon icon-menu">show sidebar</span></a>
        <h1>Page 2</h1>
    </header>
    <article class="content scrollable header">
        <section id="page2_list" data-type="list"></section>
    </article>
</section>

Answer 1

I have an example using buildingblock (draw)

https://github.com/marti1125/Earthquake

Try to copy this: https://github.com/marti1125/Earthquake/blob/master/css/app.css