I was wondering if anyone could guide me on how to have the picture in each cell change after 2 seconds IF the user does not click it in time but if the user does click on the image, it goes to another cell (as it currently does)

Thank you

I think i would use the timeout and interval functions, but i am not sure.

PHP Code:
<html>
<head>
    <STYLE type="text/css">


TD
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 75pt;
    WIDTH: 75pt;

    COLOR: black;
    FONT-FAMILY: Wingdings;
    HEIGHT: 20pt;

    TEXT-ALIGN: center
}

H5
{
    MARGIN-TOP: 0px;
    MARGIN-BOTTOM: 0px
}

    </STYLE>
<script style="text/javascript">


var score=0;
var start;




function putscore()
    {
        scoreDate=new Date()
        var now=scoreDate.valueOf();
        if (document.getElementById)
        document.getElementById("score").innerHTML=score ;  
    }

function reset()
    {
        score=0;
        putscore();
    }

function highlight(cell)
    {
        var oncell = false;
        var r=Math.round(9*Math.random()) +10;
        var imgSrc = "mole.jpg";
        var imgCell;
        if (document.getElementById) {
        cell = document.getElementById(cell);
        if (cell && cell.innerHTML != "&nbsp;") {
            cell.innerHTML = "&nbsp;";
                oncell = true;
        }
        
if (oncell) {
            
            imgCell = document.getElementById("cell_"+r);
            if (imgCell)
        {
                imgCell.innerHTML = '<img src="mole.jpg" border="0" alt="Picture Unavailable">';
            }
        else
        {
                document.getElementById("cell_10").innerHTML = '<img src="mole.jpg" border="0" alt="">';
            }
            
            score++;
            putscore();
        }
    }
}
</script>
</head>

<body>

<h2 align="center">Whack the Mole</h2>

<h4 align="center">Hits=<span id="score">0</span></h4>

<table border="1" align="center" cellspacing="0" cellpadding="0">
    <tr>

        <td id="cell_10" onclick="highlight('cell_10');return true;"><img src="mole.jpg"></td>
        <td id="cell_11" onclick="highlight('cell_11');return true;">&nbsp;</td>
        <td id="cell_12" onclick="highlight('cell_12');return true;">&nbsp;</td>
        
    </tr>
    <tr>
        <td id="cell_13" onclick="highlight('cell_13');return true;">&nbsp;</td>
        <td id="cell_14" onclick="highlight('cell_14');return true;">&nbsp;</td>
        <td id="cell_15" onclick="highlight('cell_15');return true;">&nbsp;</td>
        
    </tr>
    <tr>
        <td id="cell_16" onclick="highlight('cell_16');return true;">&nbsp;</td>
        <td id="cell_17" onclick="highlight('cell_17');return true;">&nbsp;</td>
        <td id="cell_18" onclick="highlight('cell_18');return true;">&nbsp;</td>
    
    </tr>

    

</table>
<p align=center><input type="reset" onclick="javascript:reset(); return true;"></p>


</body>
</html>