title: jquery add exception to click outside of div
body: <p>I have several overlapping divs on my website and I try to close the second one when the first one is clicked outside only if the outer div of the second overlapping div does not exist or is clicked.</p>
  <p>When the first overlay (menu) is displayed, clicking outside closes it.
  When clicking on one of the three radio inputs inside the (menu, a second overlay is displayed and must interrupt the &quot;CloseBigMenu()&quot; function which made it possible to close the &quot;menu&quot;: first overlay, only if this second overlay exists and a button inside is clicked.</p>
  <pre><code>$(document).on('click', function(e){
          if(BigMenu.hasClass('active')){
              if (!BigMenu.is(e.target) &amp;&amp; !$(&quot;#BtnMenu&quot;).is(e.target) &amp;&amp;
                  BigMenu.has(e.target).length === 0 &amp;&amp; $(&quot;#BtnMenu&quot;).has(e.target).length === 0 ){
                  if($(&quot;#WinChangeSpace&quot;).length === 0 &amp;&amp; !$(&quot;#ChangeSpaceNo&quot;).is(e.target)){
                          CloseBigMenu(); 
                          $(&quot;#ListShortKeys&quot;).removeClass('active').addClass('SlideY');
                  } 
              }
          }
      });
  </code></pre>
  <p>I also tried to interrupt the function CloseBigMenu(), without result .</p>
  <p>structure :</p>
  <pre><code>&lt;div id=&quot;BigMenu&quot;&gt;
  &lt;input type=&quot;radio&quot; name=&quot;radioSpace&quot; id=&quot;radio-1&quot; value=&quot;&quot;&gt;
  &lt;input type=&quot;radio&quot; name=&quot;radioSpace&quot; id=&quot;radio-2&quot; value=&quot;2&quot;&gt;
  &lt;input type=&quot;radio&quot; name=&quot;radioSpace&quot; id=&quot;radio-3&quot; value=&quot;3&quot;&gt;
  &lt;/div&gt;
  &lt;div id='WinChangeSpace'&gt;&lt;span id='ChangeSpaceNO' &gt;&lt;/span&gt;&lt;/div&gt;
  </code></pre>
  <p>#WinChangeSpace is added with jquery append on click to input radio</p>
  <p>The function :</p>
  <pre><code>function CloseBigMenu(){
          BigMenu.removeClass('active').addClass('bounceT');
          setTimeout(ReinitializeHeight, 700);
          function ReinitializeHeight() {
            BigMenu.removeClass('ptop66 bounceB').addClass('ptop-500');
          }
      }
  </code></pre>
  <p>bounceB and bouceT is an css animation.</p>
  <p>Currently when I click on &quot;#WinChangeSpace&quot; or &quot;#ChangeSpaceNO&quot; the two overlays closed in same time instead of only second.</p>
  <p>Is it possible to add an exception on a click outside an element ? can you help me to reason?</p>