Essayer de lignes arbitraires Zebra dans une table

Question

J'ai une table qui a des lignes qui sont marqués par une classe. Ces lignes doivent être zèbre rayé. La mise en garde est qu'ils ne sont pas toujours consécutifs.

J'ai essayé CORR table et nom de la classe, mais le résultat final est toujours incorrect. Ce qui se passe est que le striping sera appliqué au niveau de la table, puis activée uniquement sur les lignes avec la classe.

Qu'est-ce que je dois changer pour faire ce travail comme je compte?

Script

function FormatTable()
{
   $("#TableId .arbitrarySelector:nth-child(2n+1)" ).addClass('anotherEquallySpecialRow')
}

HTML

<table id="TableId" onclick="FormatTable()">
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should NOT be changed but is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
</table>

Answer 1

Vous pourriez être fait cela aussi difficile. Si vous voulez faire zébrures, pourquoi ne pas simplement utiliser quelque chose comme le : sélecteur impair et le changement la classe en fonction. Quelque chose comme ça ...

// Add zebra striping.
$('.arbitrarySelector:odd').addClass('zebra');

Et puis le CSS serait quelque chose comme ...

.zebra 
{
    background-color: #dddddd;
}