jQuery- Hide table -> After reloading page,my table shows up for couple seconds

Question

I have problem with my table.I use jQuery function .hide().

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

And that works perfectly, but there is one problem.After reloading page, my table shows up for couple seconds and then hide. I have been trying many things, i put .hide() function first in list but still nothing.

I used $("#table").css("display", "none"), but still i have same problem.

What should i do?

Answer 1

You could do something like,

Add style to table For Example,

<table id="table" style="display: none">
  <thead>
    <tr>
      <td>Name</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Thiru</td>
    </tr>
  </tbody>
<table>

Answer 2

You do not need to use jQuery to hide content on load, just use display: none.

#table {
  display: none;
}

To answer to your question, I you are using hide() into a $(document).ready(function() {}). So it is executed after your page is fully loaded.