CSS Issue in JQuery [duplicate]

Question

Possible Duplicate:
Why does $('#table > tr') selector not match? (always return 0)

I tried to apply color to rows of a table using the following code. It doesn't work, but I don't understand why. Could someone explain why or point me in the right direction?

HTML:

<table id="tblSample" border="1" cellpadding="0" cellspacing="0" width="300px">
    <tr>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>
        <td>2</td>
        <td>2</td>
    </tr>
</table>

JQuery:

$("#tblSample > tr").css("background-color", "gray");

Answer 1

Try it

$("#tblSample  tr").css("background-color", "gray");

or

$("#tblSample tr td").css("background-color", "gray");

Answer 2

You're missing the elusive tbody element.

http://jsfiddle.net/m7HTt/

You can do this:

$("#tblSample > tbody > tr").css("background-color", "gray");

or this:

$("#tblSample tr").css("background-color", "gray");

Answer 3

If you are looking to do alternating row colors you can do something as simple as this as well.

$("#tblSample tr:even").css("background-color", "gray");