Before you say "use live()", please realize that this isn't just about clicking - it's about jQuery's failure to parse anything that's added to a page using append(), regardless of what needs to be done.

Basically, if you append() html to your page, and you attempt to do anything with it using jquery (for example, adding a click function, toggling a class or visibility, adding to an accordion, etc), jQuery simply ignores it and never parses it.

In terms of clicking, it's fine that we have the live() event, but the rest is just not expected behavior.

Example:

$(function(){

$("#InvoiceList").append("<p class=\\"trigger\\"><a href=\\"#\\">Fail Link</a></p><div class=\\"details\\">Test Extra content</div>");

$(".details").hide();

$("p.trigger").click(function(){

$(this).next(".details").slideToggle("slow,");

});

$("p.trigger").live("click", function(){

$(this).next(".details").slideToggle("slow,");

});

});

And within the body:

<div id="InvoiceList">

<p class="trigger"><a href="#">Test Entry</a></p>

<div class="details">Test Details</div>

</div>

In this example, the "Test Details" is hidden, and clicking on "Test Entry" shows and hides the details, perfectly.

The added "Fail Link" does not work, and the "Test Extra Content" is visible and stays visible when clicking on "Fail Link".

Expected Behavior: Obviously, adding content to a div should make this new content subject to the same features, selectors and functions as content already in the page, but since this doesn't work, how does anyone work with jQuery and dynamic content???