title: Click on toggle open all the divs, how to avoid it?
body: <p>I have a toggle for social sharing inside the article but when I click on it, it opens in all the articles.</p>
  
  <p>I tried to do something in the css, but I think the problem is in the jquery.</p>
  
  <pre><code>$(document).ready (function(){
  $(".social-box").click(function(){
  $(".a").toggleClass("active");
  });
  $(".social-box").click(function(){
  $(this).toggleClass("activered");    
  </code></pre>
  
  <p>I expect it opens only in the article selected.</p>
  
  <p>Edited:</p>
  
  <pre><code>&lt;div id="post"&gt;&lt;div class="social-box"&gt;&lt;h5&gt;&lt;i class="fa fa-share-alt"&gt;&lt;/i&gt;&lt;/h5&gt; 
           &lt;div class="a"&gt;&lt;a href="https://www.facebook.com/"&gt;&lt;i class="fab fa-facebook-f"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="a"&gt;&lt;i class="fab fa-instagram"&gt;&lt;/i&gt;&lt;/div&gt;
              &lt;div class="a"&gt;&lt;i class="fab fa-twitter"&gt;&lt;/i&gt;&lt;/div&gt;
              &lt;div class="a"&gt;&lt;i class="fab fa-pinterest"&gt;&lt;/i&gt;&lt;/div&gt;
          &lt;/div&gt; &lt;p&gt;&lt;/p&gt;&lt;/div&gt;
  </code></pre>