Why doesn't jquery fadeIn() work with .html()?

Question

When you click you a checkbox I want the message to fade in slowly.

Why doesn\'t .fadeIn() work in this example?

HTML:

Answer 1

No idea why but I've had trouble chaining this before. You can get the effect you want by using this less elegant code:

google.load("jquery", "1.3.2");

//run when page is loaded
google.setOnLoadCallback(function() {

    $('.checkboxList .row').css('color','red');
    $('.checkboxList input').attr('checked', true);
    $('.checkboxList input').bind('click', function() {
        $('#message').hide(); //just in case
        $('#message').html("You clicked on a checkbox.");
        $('#message').fadeIn('slow');
    });

});