<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Highlight table row record on hover - jQuery</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
</head>
<body>
<h1>Highlight table row record on hover - jQuery</h1>
<table border="1">
<tr><th>No</th><th>Name</th><th>Age</th><th>Salary</th></tr>
<tr><td>1</td><td>Kenshin Himura</td><td>28</td><td>$100,000</td></tr>
<tr><td>1</td><td>Kenshin Himura</td><td>28</td><td>$100,000</td></tr>
</table>
<script type="text/javascript">
$("tr").not(':first').hover(
function () {
$(this).css("background","#195A72");
},
function () {
$(this).css("background","");
}
);
</script>
</body>
</html>
Cairo-Coders is the one place for high quality web development, Web Design and software development tutorials and Resources programming. Learn cutting edge techniques in web development, design and software development, download source components and participate in the community.