When to use on("selector") and when on("selector", "selector")
<p>Using jQuery <code>on()</code> version 1.7. I bind my events usually like this:</p>

<pre><code>$(".foo").on("click", function() {
    console.log("foo clicked");
})
</code></pre>

<p>Now after seeing someone elses code, I seen you also can bind like this, specifying a secondary parameter for a specific element (Not sure why it was written like this):</p>

<pre><code>$(document).on("click", ".bar", function() {
    console.log("bar clicked");
})
</code></pre>

<p>As seen in this <a href="http://jsfiddle.net/JWUyn/1/" rel="nofollow"><strong>fiddle</strong></a>, they both do the same thing.</p>

<p>I always bind directly to the element as in the first code sample and never have any issues.</p>

<p>When would I need to use the other way of binding and what is the benefit of one over the other?</p>
