title: How to tell what type of element an event was triggered on
body: <p>I am using the following module to reveal a sub menu:</p>
  
  <pre><code>icisSite.fatNav = function(trigger){
  
      function init() {
          width = 0,
          $mainMenuListEl = $('.nav-SiteNav .nav-list &gt; li'),
          $subNav = $('.subNav &gt; li &gt; ul');
          appendSubNav();
          getWidth();
      };
  
      function appendSubNav(){
          $subNav.each(function(index){
              index = ++index;
              $(this).appendTo($mainMenuListEl[index]);   
          });    
      };
  
      function subNavShow(trigger){
          setWidth(trigger);
          trigger.toggleClass('hover');   
      };
  
      function subNavHide(trigger){
          trigger.toggleClass('hover');
          trigger
          .find('ul')
          .removeAttr('style');
      };
  
      function getWidth(){
          $mainMenuListEl.each(function(index){
              width += parseInt($(this).outerWidth());
          });
  
          width = width - 11;
      };
  
      function setWidth(trigger){
          trigger
          .find('ul')
          .css({'width': width}); 
      };
  
      return {
          setup: init,
          show: subNavShow,
          hide: subNavHide
      };
  
  }();
  
  icisSite.fatNav.setup();
  
  $('.nav-SiteNav .nav-list &gt; li:gt(0)').hover(function() {
      $this = $(this);
      icisSite.fatNav.show($this);    
  },function(e) {
      icisSite.fatNav.hide($this);
  });
  
  $('.nav-SiteNav .nav-list &gt; li:gt(0) a').focusin(function() {
  
      var $this = $(this);
  
      $this
      .parent()
      .toggleClass('hover');
  
      $this
      .parent()
      .find('ul')
      .css({'width': icisSite.width});
  
  }); 
  
  $('.nav-SiteNav .nav-list &gt; li:gt(0) a').focusout(function() {
  
      var $this = $(this);
  
      $this
      .parent()
      .toggleClass('hover');
  
      $this
      .parent()
      .find('ul')
      .removeAttr('style');
  
  });
  </code></pre>
  
  <p>I want to refactor to accomodate the focusin and focusout events. As the code is very similar to the hover event but not the same.</p>
  
  <p>I am unsure how to do this other than checking the type of element that 'trigger' is and wondered if there is a better way?</p>
  
  <p>I am not even sure how to retrieve the type of element either?  So if it was a hover it would return an li element and a focus an anchor element.</p>