JavaScript - Hide a Div at startup (load)

Question

I have a div in my php page that uses jQuery to hide it once the page has loaded. But is there a way to hide it from the very start of loadup?

The reason I ask is because for a brief second, you can see the div when the page is loading, and then hides when the page is fully loaded.

It looks unprofessional.

Just wondering if there is a way around this?

Thanks

Answer 1

Use css style to hide the div.

#selector { display: none; }

or Use it like below,

CSS:

.hidden { display: none; }

HTML

<div id="blah" class="hidden"><!-- div content --></div>

and in jQuery

 $(function () {
     $('#blah').removeClass('hidden');
 });