Animating dynamic elements with jQuery

I can't get a fadeout animation working on a dynamically added element.

What I am trying to do is create mechanism where I can have changing backgrounds on a site.

The idea is that I will create a te开发者_运维技巧mporary div with the same class as the body, change the class of the body then fade out the temporary div destroying it once the animation is complete.

The linked example is basic. The backgrounds will have different images, not colours in the real thing so using the jQueryUI addClass extension will not work.

Here's a fiddle

Thanks in advance.

Try this instead. Not sure what you're intending with this animation, but it seems to 'work' this way.

    $('#wrapper').fadeOut(2e3, null, function () {
        $page.unwrap($wrap);
    });