title: Jquery - Show current div when click a link and hide others
body: <p>When I click on Show/hide link it shows both divs and I want it to show only its related div. How can I do that? I don't want to use ID's for each div.</p>
  
  <p><a href="https://jsfiddle.net/brunodd/pzc8vy9b/" rel="nofollow">jsfiddle</a></p>
  
  <pre><code>&lt;div class="main-box"&gt;
      &lt;a href="#" class="show_hide"&gt;Show/hide&lt;/a&gt;
  
      &lt;div class="slidingDiv"&gt;
      First div.
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;br/&gt;
  
  &lt;div class="main-box"&gt;
      &lt;a href="#" class="show_hide"&gt;Show/hide&lt;/a&gt;
  
      &lt;div class="slidingDiv"&gt;
      Second div.
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and</p>
  
  <pre><code>$(document).ready(function(){
      $(".slidingDiv").hide();
      $(".show_hide").show();
  
      $('.show_hide').click(function(){
      $(".slidingDiv").slideToggle();
      });
  });
  </code></pre>