title: JQuery document click unbind removes all children click events
body: <p>I add a click event to a specific element using JQuery's <code>live()</code>:</p>
  <pre><code> $('#foo').live('click');
  </code></pre>
  <p>Later, I add <code>bind()</code> to document:</p>
  <pre><code> $(document).bind('click');
  </code></pre>
  <p>Once document is clicked, I unbind document click:</p>
  <pre><code> $(document).unbind('click');
  </code></pre>
  <p>This caused problem: my <code>#foo</code> element no longer has a click event because it is document's child. How can I remove document's click leaving <code>#foo</code> element untouched?</p>
  <p>Here is demo:
  <a href="http://jsfiddle.net/zS2Mt/2/" rel="nofollow noreferrer">http://jsfiddle.net/zS2Mt/2/</a></p>