Untitled

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
	<title>Untitled</title>
	<style type="text/css">
		table{
			border-collapse:collapse;
		}
		td{
			border: 1px solid rgb(0,0,0);
			width: 20px;
			height: 20px;
			text-align: center;
			vertical-align: middle;
		}
	</style>
	<script type="text/javascript">
		var tbl = null;
		function hookTable(){
			tbl = document.getElementById("tblMain");
			if (tbl !== null){
				for(var i = 0; i < tbl.rows.length; i++){
					for (var j = 0; j < tbl.rows[i].cells.length; j++){
						tbl.rows[i].cells[j].onclick =
							function () { getVal(this);};
			}
        }
	}
}

function getVal(cel){


	if (cel.innerHTML == 0) {
      cel.style.backgroundColor = "rgb(255,0,0)";
    }else{
		Math.round(Math.random()*255);
	}
}
	</script>
</head>

<body onload="hookTable();">

<?php
$len = 10;
echo '<table id="tblMain">';
for($i = 0; $i < $len; $i++){
	echo "<tr>";
	for($j = 0; $j < $len; $j++){
		echo '<td>'.mt_rand(0, 1).'</td>';
	}
	echo "</tr>";
}
echo "</table>";
?>

</body>
</html>