title: Hiding /Showing Div
body: <p>I want the (".aboutPage") to show and hide when (".about") is clicked.  On start the div is showing.  How do I incorporate the hide() with this as it is not hidden once the page loads.  Please help.  I am aware that the div has not been sized or anything, I'll do that after I get all three working.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.aboutPage {
    height: 50px;
    width: 50px;
    background-color: red;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="container"&gt;
    &lt;h1 class="title"&gt;Name Goes Here&lt;/h1&gt;
    &lt;br&gt;
    &lt;div class="menu"&gt;
      &lt;h1 class="about"&gt;About Me&lt;/h1&gt;
      &lt;h1 class="projects"&gt;Projects&lt;/h1&gt;
      &lt;h1&gt;Contact Me&lt;/h1&gt;
    &lt;/div&gt;
    &lt;div class="aboutPage"&gt; Here it Is&lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>