title: Add event listener to child whose parent has event disabled
body: <p>Weird one here. Earlier I was messing around with preventing the default <code>touchmove</code> behavior in an iOS webapp I'm building. It's easy enough to add the event listener and prevent propogation, but I need to add the default behavior back to one of it's children. As I understand it though, because the parent is disabled the child will never register the event.</p>
  
  <p>So I need a solution.</p>
  
  <p>Essentially, there's a lot of swiping going on, so the default body-scrolling behavior needs to be knocked out. The page sliding around while swiping is infuriating. Naturally, I have to  add the event listener to the outside container. Can't avoid it.</p>
  
  <p>How can I add back the default, browser controlled behavior to one of the children? I don't want to fake it with my own physics and all.</p>
  
  <p>Thanks for your help.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="mainPanel"&gt; &lt;!-- add event listener and preventDefault(); --&gt;
      &lt;div id="nonScrollingPanel&gt;&lt;/div&gt;
      &lt;div id="scrollingPanel&gt;&lt;/div&gt; &lt;!-- add event listener and re-enable default --&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>$bod.on('touchmove', '#mainPanel', function(event){
  
      event.preventDefault();
  });
  
  $('#mainPanel').on('touchmove', '#scrollingPanel', function(){
  
      return true;
  });
  </code></pre>