Online Snippets Library

Set Alternate Row Colors in jQuery

To set alternate row colors in jQuery,we use odd and even selector of jQuery.

Example

HTML
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"> </script>
<title>Set Alternate Row Colors in jQuery</title>
</head>
<body>
<table border="1">
<tr>
<td>Odd Row</td>
<td>Odd Row</td>
</tr>
<tr>
<td>Even Row</td>
<td>Even Row</td>
</tr>
</table>
</body>
</html>
Javascript
$(document).ready(function(){
$("tr:odd" ).css("background-color","#fbcff5" );
$("tr:even").css("background-color","#bbbbff");
});