JQuery - why does live work but click doesn't?

Question

We have a page with this structure:

<script type="text/javascript" src="/js/lots.of.javascript.js"></script>
<jsp:include page="html.jsp"/>

The JavaScript has lots of $(function(){...} blocks. In one block we tried a $("#mylink").click(...) but this did NOT work. However the corresponding .live('click' DID work. Why is this?

---

Update: More specifically I am assuming the click and live statements ARE running after the link has been added to the DOM as the link is included in the html.jsp file and the statements are executed in $(function(){...} blocks... So given this I'm not sure why click wouldn't work...

Answer 1

It is probably that the element with id #mylink is created later and not at the time the DOM becomes ready.

Answer 2

I would guess that the element was added to the DOM after the page was loaded. The .live method insures that elements added after will get the correct event handler.

Answer 3

Without seeing more code, there's no way to know for sure, but the only way I know of that this happens is if your control (in this case - the item with id="mylink") is created AFTER the page has loaded.

Answer 4

Seeing no code, the obvious reason is that the element is created after the event gets defined. That's the main reason to use .live().