jQuery .fadeIn () no carregamento da página?

Estou tentando configurar algum código para que eu tenha um que está oculto no início, mas depois apareça após o carregamento da página.

Eu tenho o seguinte código HTML:

<div class="hidden">
<p>This is some text.</p>
</div>

Então eu também tenho esse código CSS, que oculta o<div>.

div.hidden
{
    display: none
}

Finalmente, eu tenho meu jQuery:

$(document).ready(function() {
    $('div').fadeOut(1);
    $('div').removeClass('hidden');
    $('div').fadeIn(1000);
});

O que eu esperava que acontecesse era que o primeiro .fadeOut () desaparecesse, o removeClass impedisse o CSS de ocultá-lo, e o final .fadeIn () retornasse à página. Infelizmente, isso não funcionou.

Você pode ver o código aqui:Violino

Alguém pode me dizer como manter um<div> oculto até que uma página seja carregada e depois desbotá-la usando o jQuery?

Obrigado!

questionAnswers(4)

yourAnswerToTheQuestion