I always attack this sort of problem using something like
Javascript's splice().
The Array.splice() method will let you extract and optionally replace
the first three elements of an array. If you replace them with nothing
then you're effectively shifting three elements at a time.
Just loop while the array of elements has a length and assign a style
to the chunks of rows being spliced...
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js";></
script>
<script>
$(function(){
var rows = jQuery.makeArray($('tr'));
var i = 0;
while (rows.length) {
var block = rows.splice(0, 3);
if ( i++ % 2 == 0 ) {
$(block).each(function(){
$(this).css({backgroundColor: '#ccc'});
});
}
}
});
</script>
<style>
</style>
</head>
<body>
<table>
<tr><td> one </td></tr>
<tr><td> two </td></tr>
<tr><td> three </td></tr>
<tr><td> four </td></tr>
<tr><td> five </td></tr>
<tr><td> six </td></tr>
<tr><td> seven </td></tr>
<tr><td> eight </td></tr>
<tr><td> nine </td></tr>
<tr><td> ten </td></tr>
</table>
</body>
</html>
