Change Row background color on Mouseover

Sample Table:

<table>

<tr>

<td>

row1 col1

</td>

<td>

row1 col2

</td>

</tr>

<tr>

<td colspan="2">

row2 col1

</td>

</tr>

</table>

Sample Code 1:

<script type="text/javascript" src="jQuery1.5.1.js"></script>

<script language="javascript" type="text/javascript">

$(document).ready(function(){

var clicked = false;

var origColor = "";

$("tr").mouseover(function () {

origColor = $(this).css("background-color");

$(this).css("background-color","red");

});

$("tr").mouseout(function () {

clicked == false ?  ($(this).css("background-color",origColor)) :  (clicked = false);

});

$("tr").click(function () {

$("tr").css("background-color","aqua");

$(this).css("background-color","red");

clicked = true;

});

});

</script>

Sample Code 2:

<script type="text/javascript" src="jQuery1.5.1.js"></script>

<script language="javascript" type="text/javascript">

////Chaining

var clicked = false;

var origColor = "";

$(document).ready(function () {

$("tr").mouseover

(

function () {

origColor = $(this).css("background-color");

$(this).css("background-color", "red");

}

).mouseout

(

function () {

//$(this).css("background-color", "aqua");

clicked == false ? ($(this).css("background-color", origColor)) : (clicked = false);

}).click(

function () {

$("tr").css("background-color", "aqua");

$(this).css("background-color", "red");

clicked = true;

});

});

</script>

Sample Output:

For any Queries feel Free to Contact...