css - Achieve alternate row colours across multiple tbody elements -

is there way in css achieve alternate row shading rows across multiple tbody elements treated 1 group?

so example:

<tbody>     <tr>...</tr> </tbody> <tbody>     <tr>...</tr> </tbody> <tbody>     <tr>...</tr> </tbody> 

i know of nth-child, not work here, since if each tbody has 1 row, coloured same.

anyone know of ways achieve behaviour?

not css...no. nth-of- doesn't work way. need javascript.

jquery makes easy.

$("#my-table tr:even").css("background-color", "#bbbbff");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <table id="my-table">    <tbody>      <tr>        <td>row 1</td>      </tr>    </tbody>    <tbody>      <tr>        <td>row 2</td>      </tr>    </tbody>    <tbody>      <tr>        <td>row 3.1</td>      </tr>      <tr>        <td>row 3.2</td>      </tr>    </tbody>    <tbody>      <tr>        <td>row 4.1</td>      </tr>      <tr>        <td>row 4.2</td>      </tr>      <tr>        <td>row 4.3</td>      </tr>    </tbody>    <tbody>      <tr>        <td>row 5</td>      </tr>    </tbody>  </table>