Привет! Помогите доделать код. Идея такая: нужно сделать три постепенно появляющиеся друг за другом строки. Что-то похожее я нашел в интернете, там на примере все работает. Но т.к в JS я не шарю и даже не знаю как правильно его подключать, и как применяются библиотеки JQUERY, то не могли бы вы мне сказать как сделать этот код рабочим?
Это код с интернета:
HTML

<div id="ef1" class="myEffect">text1</div>
<div id="ef2" class="myEffect">text2</div>
<div id="ef3" class="myEffect">text3</div>

CSS

.myEffect{display:none}

JQUERY

$('#ef1').fadeIn(1000,function(){
    $('#ef2').fadeIn(1000,function(){
        $('#ef3').fadeIn(1000)
    })
})

У меня такая байда:
HTML

<div id="lozung">
	<div id="ef1" class="myEffect"><h1>Заголовок H1</h1></div>
	<div id="ef2" class="myEffect"><h2>Заголовок H2</h2></div>
	<div id="ef3" class="myEffect"><p>Пусть будет описание.</p></div>
</div>

CSS

.myEffect{
display:none
}

JQUERY

$('#ef1').fadeIn(1000,function(){
    $('#ef2').fadeIn(1000,function(){
        $('#ef3').fadeIn(1000)
    })
})

Может в коде каких запятых не хватает. И куда он подключается в шапку сайта или после дива lozung?