Mudar cor ao clicar na div, como?

Pessoal,

Consegui fazer com que ao clicar em uma div, ela, que possui uma cor X ao "sofrer" o clique, fique com uma cor Y. Minha dúvida é: como faço para que, ao clicar fora da div ou clicar nela mesma, a DIV retorne a cor X?

Exemplo:

Tenho uma DIV na cor cinza. Ao clicar nela, ela se adquire a cor vermelha. Ao clicar fora da DIV ou dentro dela novamente, torna-se cinza novamente. Como fazer isso?

Obtive êxito na primeira etapa:

$("#box").click(function(){
 $(this).stop().animate({ backgroundColor: "#ff0000" }, 500);
});

Essa transição entre cores que estou procurando fazer, funciona perfeitamente com HOVER:

$("#box").hover(function(){
 $(this).stop().animate({ backgroundColor: "#ff0000" }, 500);
},function(){
 $(this).stop().animate({ backgroundColor: "#ddd" }, 500);
});

Mas como aplicar a técnica hover ao .click?

:)