What's a Jelo Shot? How do I use these tutorials?

Tutorial: Fancy Table Rows

Alternate row color

<!-- relevant CSS -->
<style type="text/css">
    .even td, .even th {
        background: #abc;
    .odd td, .odd th{
        background: #def;

<!-- relevant HTML -->
<table class="alternate">
    <caption>Stock Information (demo only!)</caption>
        <td>Alcoa Inc.</td>
        <td>Wal-Mart Stores, Inc.</td>

<!-- relevant JavaScript -->
<script type="text/javascript">
    Jelo.each($$('.example tr'), function(item, index) {
        Jelo.CSS.addClass(this, (index % 2) ? 'even' : 'odd');

Run the Jelo Shot above by clicking the orange icon, then click here to reset the table.
Stock Information (demo only!)
Company Price Change
Alcoa Inc. $29.01 +0.42
General Motors Corporation $30.27 +1.09
Hewlett-Packard Co. $36.53 -0.03
Microsoft Corporation $25.84 -0.14
Wal-Mart Stores, Inc. $45.45 +0.73

See Jelo API for complete details.