title: touchend event in ios webkit not firing?
body: <p>I'm trying to implement a menu for a ios webkit based app in which the user touches/clicks and holds a menu button ('.menu_item'), after 500ms the sub menu opens (div.slide_up_sub_menu), and a user should be able to slide their finger/mouse up to a submenu li item and release. </p>
  
  <pre><code>    &lt;li class="menu_item"&gt;
         ASSET MANAGEMENT
         &lt;div class="slide_up_sub_menu hidden_menu"&gt;
           &lt;ul class="submenu"&gt;
             &lt;li&gt;Unified Naming Convention&lt;/li&gt;
             &lt;li&gt;Version Control&lt;/li&gt;
           &lt;/ul&gt;
         &lt;/div&gt;
      &lt;/li&gt;
  </code></pre>
  
  <p>The application should then be able to detect which submenu item the touchend/mouseup event happened on. I'm binding a touchstart event to the menu item, waiting for 500ms, and afterwards telling the submenu to show. When a user releases their finger a touchend event should fire closing the submenu. If the user has stopped their touch on a submenu item it should be detected. Currently detection of which submenu item a mouseup event happened on works in Safari on the desktop: </p>
  
  <pre><code>$('ul.submenu li').live('mouseup', function(e){
     console.log($(e.currentTarget)); //works on the desktop
  });
  </code></pre>
  
  <p>but if I do the same using a touchend handler it doesn't work on an ipad:</p>
  
  <pre><code>$('ul.submenu li').live('touchend', function(e){
     console.log($(e.currentTarget)); //never fires
  });
  </code></pre>
  
  <p>if I look for every touchend event I can get a reference to the parent sub menu item when I end the touch on a submenu item:</p>
  
  <pre><code>$(document.body).bind('touchend', function(e) {
      console.log($(e.target).html()); //logs ASSET MANAGEMENT
   });
  </code></pre>
  
  <p>but no reference to the submenu item. </p>
  
  <p>Does anyone have any idea why a touchend event is not being fired on the submenu items?</p>
  
  <p>Thanks </p>