title: using jquery to addclass when an anchor is clicked
body: <p>having trouble with this.  Any help would be appreciated.
  I'm trying to add the "slide" class to the left-menu div by using the Id "lm"
  doesn't seem to be working for me.</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-js lang-js prettyprint-override"><code>$(document).ready(function() {});
  
  $("#toggle", ).click(function() {
    $("#lm").addClass("slide");
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>  .left-menu {
    height: 55%;
    width: 45%;
    position: absolute;
    top: 0;
    left: 0;
    padding: 0;
    list-style: none;
    border-right: 2px solid #fff;
    background-color: #000;
    z-index: 1000;
  }
  
  .slide {
    -webkit-transform: translate(-20, 0);
    -moz-transform: translate(-20em, 0);
    -o-transform: translate(-20em, 0);
    -ms-transform: translate(-20em, 0);
    transform: translate(-51em, 0);
    -webkit-transition: 10s;
    -moz-transition: 10s;
    -o-transition: 10s;
    transition: 10s;</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;header class="container-fluid header"&gt;
    &lt;div class="text-vertical-center apple-effect"&gt;
      &lt;a id="toggle" href="#"&gt;[sv]&lt;/a&gt; &lt;/div&gt;
  &lt;/header&gt;
  &lt;div class="container-fluid"&gt;
    &lt;div class="left-menu" id="lm" role="navigation"&gt;
      &lt;a class="nav-link" href="#"&gt;Home&lt;/a&gt;
    &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>