js click on any area pop-up layer disappears to implement the code

This article has shared the specific code of the pop-up layer disappearing in any area of js clicking on it for your reference. The specific content is as follows

Use jquery (); to determine whether the click area is on the pop-up layer or on the button, otherwise the pop-up layer will disappear.

Complete code

&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
 &lt;meta charset="UTF-8"&gt;
 &lt;title&gt;Title&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;pre&gt;
 parent &gt; child
 Match all child elements under the given parent element
&lt;/pre&gt;

&lt;div class="help"&gt;
 &lt;span class="bnt"&gt;I'm the pop-up layer&lt;/span&gt;
 &lt;ul  class="foo"&gt;
 &lt;li&gt;&lt;a href="#">Article 1</a></li> &lt;li&gt;&lt;a href="#">Article 2</a></li> &lt;li&gt;&lt;a href="#">Article 3</a></li> &lt;li&gt;&lt;a href="#">Article 4</a></li> &lt;/ul&gt;
&lt;/div&gt;

&lt;style&gt;
 .bnt{
 width: 100px;height: 50px;background: #777;color: #fff;
 display: block;
 text-align: center;
 line-height: 50px;
 cursor: default;
 }
 .help ul{
 display: none;
 border: 1px solid #aaa;
 }
 a{display: block;padding: 10px;}
&lt;/style&gt;

&lt;script src="../"&gt;&lt;/script&gt;
&lt;script&gt;

 (function ($) {
 $('.bnt').click(function(){
  if($(this).hasClass('show')){
  $('.help ul').hide();
  $(this).removeClass('show')
  return ;
  }

  $('.help ul').show();
  $(this).addClass('show')

 })

 ('click',function (e) {
  var parent=$().parents('.foo,.help');

  if(===0){
  ('Not in the bullet layer and button area')
  //Operate this area
  $('.help ul').hide();
  $('.bnt').removeClass('show');

  }else{
  ('Button and Bullet Area')
  }
 })
 })(jQuery);
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.