title: Always show hamburger menu in materializecss
body: <p>How can I always display the menu icon on navbar materializecss? Like when clicked, the drawer appears and hides vice versa.</p>
  
  <p>Html:</p>
  
  <pre><code>&lt;nav class="default" role="navigation"&gt;
      &lt;div class="nav-wrapper"&gt;
        &lt;a href="#!" class="brand-logo center"&gt;Brand&lt;/a&gt;
        &lt;a href="#" data-activates="mobile-demo" class="button-collapse"&gt;&lt;i class="material-icons"&gt;menu&lt;/i&gt;&lt;/a&gt;
        &lt;ul class="right hide-on-med-and-down"&gt;
          &lt;li&gt;&lt;a href="#"&gt;Login&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a class="waves-effect red waves-light btn"&gt;Sign up&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
        &lt;ul class="side-nav" id="mobile-demo"&gt;
          &lt;li&gt;&lt;a href="#"&gt;Login&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Sign up&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/nav&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>$('.button-collapse').sideNav({
        menuWidth: 300, // Default is 240
        edge: 'left', // Choose the horizontal origin
        closeOnClick: true // Closes side-nav on &lt;a&gt; clicks, useful for Angular/Meteor
      }
    );
  </code></pre>