Hi,
I'm trying to do the following:
I have two sets of DOM elements on a page. All elements in the first set carry the class display-element
, and the second set of elements carry the class edit-element
.
Now I have a button (id=edit-button
). When I click this button, I want all the display-elements
to fade out, and all the edit-elements
to appear.
I naturally did:
$('#edit-button').click(function(){
$('.display-element').fadeOut(300, function() {
$('.edit-element').fadeIn(300);
});
});
I found to my surprise that this did not work as expected. This is what happened: as soon as the first element with class display-element
faded out, all the edit-elements
started fading in.
Now is there any easy way (perhaps something in the documentation I missed) using which I can have all the edit-elements
start fading in only after all display-elements
have faded out?
Thanks
jrh