テーブルの背景色を１行おきに変更してみる

今作成している案件で、結構ボリュームのある一覧表を載せるページがありまして…。
縦に長い表だと、視認性を上げるために１行おきに背景色を変更するなんてコトも常套手段となる訳です。

これまでは手作業で、tr要素にclass指定をして、CSSで背景色を変更したりしていたんですが、この方法だと表の途中で追加したり、削除したりという修正がとても手間…というか、ほとんどやり直しになってしまいます。
Javascriptを使えば、何か手軽な方法があるんだろうなぁとは思っていたモノの、なかなか必要に迫られずにサボっていました。

前置きが長くなりましたが、
調べた所、jQueryを使えばとても簡単だ！というコトが分かり、紹介してみます。
参考にしたのは、「sukechan.net」さんの「jQuery でテーブルの背景色を 1 行置きに変更する」というページです。

まず、jQueryから最新のスクリプトをダウンロードして下さい。
HTMLソースにスクリプトを読み込み、下記のように記述
（例）
<script type="text/javascript"><!--
$(function() {
    $(".stripe tr:even").addClass("even");
});
//--></script>

次に適用するtable要素にstripeとclass指定して、
CSSで例えば、
.stripe .even td {
    background-color: #FBF8EE;
}
と、定義してみて下さい。

これで勝手に偶数行のtd要素の背景色が変更できます。項目の並びが変更されようが、追加・削除されようが全然OKです。
さらに、table要素に限らず、li要素などにも応用できます！

…んっ！？
もしかして、プログラムから生成するようなtable要素にも応用できるかも？
今度実験してみます。