title: Toggle Hide/Show sidebar jQuery not working
body: <p>i can't figure out why the toggle isn't working in my code. This should hide the sidebar when i click on the navbutton, but it doesn't. Thank you very much for reading my question. </p>
  
  <p><strong>JavaScript</strong></p>
  
  <pre><code>$('#navbutton').click(function() {
  $('#sidebar').toggle('slow');
  });
  </code></pre>
  
  <p><strong>HTML/PHP (Look only between the &lt; button > &lt; /button> tag.</strong></p>
  
  <pre><code>                &lt;div id="header"&gt;
  
                  &lt;button type="button" class="btn btn-default btn-lg"id="navbutton"&gt;
                  &lt;span class="glyphicon glyphicon-align-justify"&gt;&lt;/span&gt;
                  &lt;/button&gt;
  
                  &lt;div id="title"&gt;
                  &lt;a href="home.php" style="color:#fafafa;text-decoration:none;"&gt;Trigger&lt;/div&gt;
                  &lt;div id="MenuInHeader"&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="logout.php"&gt;&lt;i class="fa fa-external-link fa-fw"&gt;&lt;/i&gt; Logout&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;
              &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>#sidebar {
  position:absolute;
  left:0;
  width:200px;
  height:100%;
  background:#5e5e5e;
  opacity:0.9;
  }
  </code></pre>