I'm trying to change the background of an element on click based on the current color.

Here's the relevant html:

<div id="rect" style="height: 100px; width:300px; background: red">
</div>

and my jquery attempt:

    $("#rect").click(function() {
    if ($(this).css('background') == 'red') {
        $(this).css('background','blue');}
    else {$(this).css('background','yellow');}
    });

I'm always getting a yellow box; the 'true' condition never fires.

What am I doing wrong?