0

Although I understand this question has been asked on SO many times before, I have tried playing around with this ages but still no success.

<script>
  if ($('.pop-up-bottom-notif-cl').hasClass('is-active-below-notif') === true) {
    $('body').click(function(e){
      if (e.target.id != 'pop-up-bottom-notif') {
        $('#pop-up-bottom-notif').removeClass('is-active-below-notif');
      }
    })
  };
</script>

So if the element has a certain class (which it will do when is visible on the page), then it listens for a click event - if the click target does not have the id of 'pop-up-bottom-notif' then remove the class of that element.

Any ideas what I could be missing?

Update: Here's a section of the HTML

<div class='pop-up pop-up-notif pop-up-bottom-notif-cl' id='pop-up-bottom-notif'>
  <div id='notif-pop-up-x'>
    <div id='pop-up-close-btn'>
      <img src="img/close.png" title='Close'/>
    </div>
  </div>
  <div class='notif-pop-up-cta'>
    <a href='{% url "co-notifs" %}'>View all</a>
  </div>
</div>

and I have also tried using the .not() method, :not selector amongst other ways - and so the solution must be slightly different from other questions

Rob
  • 14,746
  • 28
  • 47
  • 65
jayt
  • 758
  • 1
  • 14
  • 32
  • is the target what you think it is? Maybe some sample HTML would be helpful so we can test out what you are doing. – epascarello Nov 17 '17 at 14:07
  • @epascarello Updated the Q. – jayt Nov 17 '17 at 14:14
  • try this : – samehanwar Nov 17 '17 at 14:31
  • @samehanwar Unfortunately that didn't work – jayt Nov 17 '17 at 14:34

0 Answers0