Question

Why it is not working?

jQuery code:

 $("table.test #ro").hide();

HTML:

    <table class="test">
  <thead><tr class="ro"  id='ro' ><th>test</th>
  </tr>
  </thead>
  <tbody>
  <tr class="ro"><td>test</td>
  </tr>
  <tr><td>test</td>
  </tr></tbody>
  </table>

I tried it in different manner; .hide() and .css('display', 'none') are not working

Answer 1

You may need to wait for document to get ready, using $(document).ready( event. You can access direct with id as id is supposed to be unique, instead of making complex selector.

Live Demo

$(document).ready(function(){        
    $("#ro").hide();
});

This is also working which you have in question, I think you need to put it in $(document).ready(.

$(document).ready(function(){        
     $("table.test #ro").hide();
});

 
​