title: jquery on both div firing one after another
body: <p>Im trying something like this, but it doesn't seem to work.</p>
  
  <pre><code>$(document).ready(function (e) {
      $('.close').click(function () {
          $('.popup').addClass('hide');
          return false;
      })
  
      $('.close1').click(function () {
          $('.popup_2').addClass('hide');
          return false;
      })
  });
  </code></pre>
  
  <p>so hide is added to popup and popup_2</p>
  
  <pre><code>&lt;div class="popup hide" style="display: block;"&gt;
  
  
  &lt;div class="popup_2 hide" style="display: block;"&gt;
  </code></pre>
  
  <p>when this hide class is added</p>
  
  <pre><code>&lt;div id="overlay" style="display: block;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>i want this overlay to go display:none..</p>
  
  <p>logic</p>
  
  <pre><code>if(.popup.hide)&amp;&amp;(.popup_2.hide)==true
  {
      // overlay should go display:none
  }
  </code></pre>
  
  <p>kindly fix this issue</p>