Toggle element

HTML

<ul class="user-alt">
   <li class="messages">
 <a title="Messages"href="javascript:void(0);">Open/Close</a> 
   <div class="bar-pop" style="display:none;border:1px solid #ccc;padding:10px;"> 
	  Hidden block Here
      </div>
 </li>
</ul>

JavaScript

$(document).on('click', '.header-alt > li > a, .user-alt > li > a', function(e){
    var popup = $(this).parent('li').find('.bar-pop');
    $(".header-alt > li .bar-pop, .user-alt > li .bar-pop").not(popup).hide();
    $('.elgg-menu-accountparent.selectedMenuItem').not($(this)).removeClass('selectedMenuItem');
    $(this).toggleClass('selectedMenuItem');
    popup.toggle();
});