You have run into a fairly common issue: how to get events to work
with elements that are added to the DOM, through either ajax or simple
DOM mainpulation.
Rather than using the .click(fn) shorthand, use .live('click', fn)
For more information, check out this FAQ topic:
http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_Ajax_request.3F
If you still have problems after reading through it and trying one of
the many solutions, let us know.
--Karl
____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 27, 2009, at 12:01 PM, BenR wrote:
I have a problem with jQuery appending new text to a div - but then
not firing events attached to the inserted text.
Let me explain. I have a div that contains a number of divs - the div
has a link and a hidden form. Clicking on the link fires a slideToggle
event which reveals the form.
When you submit the form AJAX handles it - and jQuery builds another
div with the correct link and the correct form which it sticks on the
end of the list. That all works fine and dandy.
What I want to be able to do is to click on the newly-added link and
have it behave in the same way as the other elements that were on the
page when it was built.
However, nothing happens when you click on it. Zip. Nadda. Rien du
tout.
Usually I have found a way round the problem - but I am slightly stuck
on my current project. Apart from forcing a page reload, is there any
way to get the browser to see the newly inserted link and apply the
jQuery action to it?
Thanks
