Issue in alternate Row color using each() method of JQuery

Posted by user1323981 on Stack Overflow See other posts from Stack Overflow or by user1323981
Published on 2012-06-04T04:22:10Z Indexed on 2012/06/04 4:40 UTC
Read the original article Hit count: 112

Filed under:

I have a table as under

<table >
        <tr>
            <th scope="col">EmpId</th><th scope="col">EmpName</th>
        </tr>
        <tr>
            <td>1</td><td>ABC</td>
        </tr>
        <tr>
            <td>2</td><td>DEF</td>
        </tr>
</table>

I want to set the alternate row color of only the "td" elements of the table and not "th" by using only each() function. I have tried with

<style type="text/css">   
    tr.even { background-color: green; }   
    tr.odd { background-color: yellow; }
</style>
 $(document).ready(function () {
 $('table > tbody').each(function () {
            $('tr:odd',  this).addClass('odd').removeClass('even');
            $('tr:even', this).addClass('even').removeClass('odd');
        });
 });

Though this works but it accepts also "th" element. How to avoid that?

Please help

Thanks

© Stack Overflow or respective owner

Related posts about jQuery