Close open popups on click

http://stackoverflow.com/questions/32170911/on-click-function-close-all-open

by hibbard_eu

HTML

<ul class="user-alt">
  <li class="messages">
    <a title="Messages" class="toggle" href="#">Open/Close</a> 
    <div class="bar-pop"> 
	  Hidden block Here
    </div>
  </li>
  <li class="messages">
    <a title="Messages" class="toggle" href="#">Open/Close</a> 
    <div class="bar-pop"> 
	  Hidden block Here
    </div>
  </li>
  <li class="messages">
    <a title="Messages" class="toggle" href="#">Open/Close</a> 
    <div class="bar-pop"> 
	  Hidden block Here
    </div>
  </li>
</ul>

CSS

.bar-pop{
    display:none;
    border:1px solid #ccc;
    padding:10px;
}

JavaScript

$('.toggle').on('click', function(e){
  e.preventDefault();
  $(this).next().toggle();
});

$(document).on("click", function(e){
  if(!e.target.className.match(/toggle|bar-pop/)){
    $(".bar-pop").hide();   
  }
});