jquery:how to use ">" and children() in table -

html code:

<table>     <tr>         <td>the first row</td> <td>the first row</td>     </tr>     <tr>         <td>the second row</td> <td>the second row</td>     </tr>     <tr>         <td>the third row</td> <td>the third row</td>     </tr>     <tr>         <td>the forth row</td> <td>the forth row</td>     </tr> </table> <hr> <table>     <tr>         <td>the first row</td> <td>the first row</td>     </tr>     <tr>         <td>the second row</td> <td>the second row</td>     </tr>     <tr>         <td>the third row</td> <td>the third row</td>     </tr>     <tr>         <td>the forth row</td> <td>the forth row</td>     </tr> </table> 

jquery code:

$(function () {     $("table:first tr").css("background", "#ffbbbb");   //work     $("table:last>tr").css("background", "#ffbbbb");   //not work     $("table:last").children("tr").css("background", "#ffbbbb");  //not work }); 

result: background of first table changed, second table not. seems space selector worked, '>' , 'children()' selector doesn't, why?

working example: https://jsfiddle.net/6knk67gd/1/

i have checked usage of these 2 selectors, still can't find problem in code. please tell me how use them correctly, thank you~

even though not creating tbody, default dom structure create it, tr child of tbody/thead/tfooter not table itself

try

$("table:last > tbody > tr").css("background", "#ffbbbb");