title: Toggle div on link click
body: <p><a href="http://jsfiddle.net/FsCHJ/2/" rel="nofollow">http://jsfiddle.net/FsCHJ/2/</a></p>
  
  <p>what now happens is, whenever I have another link example it will also use this link as the toggle button. I just want Toggle Edit Mode to be toggling hidden div's on/off. So I tried to change <code>$("a").click(function ()</code> to <code>$("toggle").click(function ()</code> and <code>&lt;a&gt;Toggle Edit Mode&lt;/a&gt;</code> to Toggle Edit Mode`, but doesn't work. Any idea's? </p>
  
  <p>HTML</p>
  
  <pre><code>&lt;li&gt;&lt;a&gt;Toggle Edit Mode&lt;/a&gt;
  
  &lt;/li&gt;
  &lt;div class="hidden rightButton"&gt;hello&lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.hidden {
      display: none;
  }
  .unhidden {
      display: block;
  }
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>$(document).ready(function () {
      $("a").click(function () {
          $("div").toggleClass("hidden unhidden");
      });
  });
  </code></pre>