title: use $(document).on to bind multiple events to the same element
body: <p>I'm trying to get used to the new proper way of doing things in jQuery but I can't figure out how to do a "live" binding that's as elegant/DRY as the original. Previously, with "live" I believe you could do this, only mentioning the element once:</p>
  
  <pre><code>$("#element_id").live("click",function(){
    //stuff
  }).live("mouseover", function(){
    //stuff
  }).live("mouseout", function(){
    //stuff
  });
  </code></pre>
  
  <p>Now, with <code>$(document).on</code> it seems I would need to do this:</p>
  
  <pre><code>$(document).on("click","#element_id",function(){
    //stuff
  }).on("mouseover","#element_id",function(){
    //stuff
  }).on("mouseout","#element_id",function(){
    //stuff
  });
  </code></pre>
  
  <p>This is less concise and repeats the element. Is there an obviously simpler way to achieve this?</p>