Hide TD into DIV Using jQuery

I'm Trying to Hide an div with all TD But Only hide the text into the div and no hide the TD tags somebody know how to fix this? My Code is:

jQuery Code:

$('div#default_results').hide();

HTML Code:

<div id='de开发者_如何学运维fault_results'>
Div Content
<td class='rand_code'>
TD Content
</td>
</div>

The Result:

<td class='rand_code'>
TD Content
</td>

This is not valid mark-up. You can not have divs or text between td's. You will have to restructure your page to achieve whatever the goal is.

Try: $('.rand_code').hide(); or $("#default_results td").hide();

To do exactly what you said:

$("#default_results").replaceWith($("#default_results").find("td"));

This is actually a cross-browser issue I have run into before - some browsers [IE] will apply the opacity css property (which is how hide() works) to the object it is called on and all it's content, and some [FF] will apply it to the container only and the content will still be visible.

The only solution I ever managed to find that worked everywhere was to call hide() on both the container and all the elements it contains. This is overkill in browsers that have already hidden it but it does work.

I have not tested this for some time so my statements about which browsers will/will not support this may no longer be true.

This is valid markup and it should work:

<div>
  Div Content
  <table>
    <tr>
     <td>Table Content</td>
    </tr>
  </table>
</div>