How to show a drop down menu when click on link jquery -

i know how trap click event on link. here code

<a id="piclink_1" class="piclinks">...</a>  $('a.piclinks').click(function() {     //split @ '_' , take second offset     var picnumber = $(this).attr('id').split('_')[1];      viewer.show(picnumber); }); 

i want show drop down menu appear 2 sub menu below link when click on link. , if click outside of link of drop down menu drow down menu hide.please guide me how can achieve this. thanks

my markup like

<a id="link">about</a>  <div id="submenu">      <a href="#">about company</a><br />      <a href="#">careers</a> </div> 

try this

   $('a.piclinks').click(function() {     $('#submenu').show();      });   var mousein = false;         $('a.piclinks').click(function() {       $('#submenu').hover(function(){          mousein =true;      }, function(){          mousein =false;      });      $("body").mouseup(function(){          if( mousein == false)          $('#submenu').hide();     });  });