javascript - Reseting a button action if user starts doing something else -

I have & lt; Button & gt; is, when clicked, toggles a series of div that allows the user to delete a page.

I am trying to do this, if the user does something else in which no page is included in removing, then the button reset and the divis series disappears.

Can anyone help me?

Here's mine - Actually, when I show "Show button", then I want to show the button as if they do. But I click on something else, but I want to disappear the buttons that appear in the button ( delete-page ). Like bootstrap dropdown toggle function

  // This button is the button to activate the delete button $ ('button.delete-pages'). Click (function (e) {var btn = $ (this); // How can this deleted button click on a user $ ('button.delete-page'). ToggleClass ('active'); / / This is just pushing the button down btn.toggleClass ('active');}); .show {display: block; }  

All buttons in this content body

  
 div style = "width: 100%; border-down : 1px solid black; "& gt; & Lt; Button class = "delete-pages" & gt; Show buttons & lt; / Button & gt; & Lt; / Div & gt; & Lt; Ul id = "project page" & gt; & Lt; Li id = "page_1" & gt; & Lt; Button style = "float: true;" Class = & gt; "delete the page"; & Lt; I class = "fa-trash-o" & gt; & Lt; / I & gt; & Lt; / Button & gt; & Lt; One class = "page" href = "# page1" & gt; Page 1 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li id = "page_2" & gt; & Lt; Button style = "float: true;" Class = & gt; "delete the page"; & Lt; I class = "fa-trash-o" & gt; & Lt; / I & gt; & Lt; / Button & gt; & Lt; One class = "page" href = "# page2" & gt; Page 2 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li id = "page_3" & gt; & Lt; Button style = "float: true;" Class = & gt; "delete the page"; & Lt; I class = "fa-trash-o" & gt; & Lt; / I & gt; & Lt; / Button & gt; & Lt; One class = "page" href = "# page 3" & gt; Page 3 & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt;  

I hope this solves your problem.

  $ (document) .mouseup (function (e) {var delBtn = $ (". Delete-page"); var tglBtn = $ (". Delete-pages"); if ( ! DelBtn.is (e.target) & amp;; Amp;! TglBtn.is (e.target) & amp; amp; amp; amp; amp; nbsp; (delBtn.has (e.target)) Length === 0) & amp; amp; ; (TglBtn.has (e.target). Length === 0)) {delBtn.removeClass ('active'); tglBtn.removeClass ('active');}});  

I came to the idea from the StackHowflow reply.

We are hiding the deleted buttons by searching the position of the mouse click, but I should warn you that these keyboard actions.