[jQuery] Colorize td when mouse button is pressed

[jQuery] Colorize td when mouse button is pressed


I have a script to change the background-color property of each td of
a table when the user clicks on each td or when the mouse button is
clicked. If the button is released then the background remains the
same.
The problem is that when the mouse button is clicked and then move the
mouse in and out the table, the script works as if the mouse button is
pressed.
Any suggestions on how to fix this?
Here is the code:
var isMousedown = false;
$("#grid td")
.mousedown(function(){
    isMousedown = true;
    setColor($(this));
})
.mouseover(function(){
        //See if the mouse is clicked and the brush is active to paint the
current px
if (isMousedown)
    setColor($(this));
})
.mouseup(function(){
    isMousedown = false;
});
//Colorize pixel
function setColor(obj){
obj.css({backgroundColor:'#000000'});
}