Не передается параметр

[AllReady]

Здравствуйте. Подключил библиотеку jquery. Написал в шапке следующий код:

<script type="text/javascript">

  	$(document).ready(function() {
  		$('#bb').click(function(){
  			var test = document.getElementById('text');
  			if (test.style.display == 'none') test.style.display = 'block';
  			else test.style.display='none';
  		});
  	});
  	
  </script>

Стили:

<style>
#test {
padding: 50px;
background: #20a6df;
color: black;
}

#text {
display: none;
}

</style>

Ну и html код

<div id="test">text
  <div id="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sit amet suscipit dolor, id pretium orci. Morbi aliquet lectus mattis nisi scelerisque tristique. Maecenas hendrerit, mi vel mattis blandit, massa quam malesuada erat, sed pellentesque sapien nisl interdum quam. Suspendisse at placerat ligula. Ut arcu tellus, euismod id elementum ut, pellentesque sit amet quam. Ut ac lobortis enim, in mattis odio. Nullam faucibus a mauris sit amet volutpat. Suspendisse potenti.</div>
  </div>
  
	<button id="bb">Раскрыть</button>

Вообщем проблема в следующем. После просмотра уроков, хотел закрепить свои знания. Но тут таки проблема. Созздал кнопку, заголовок и текст. при нажатии на кнопку должен появляться текст. Да, он появляется, но при первом нажатии ничего не передается. Почему ?
Выводил через алерт(test.style.display);
Когда нажимаю, сначала ничего, пусто в оповещении. В следующие разы, уже работает появление и скрытие. Почему так могло произойти ? Я чего то не понимаю(( Вроде все правильно. Получил через getElementById - информацию о аттрибуте display, затем идут условия.

[depp]

вот ответ на ваш вопрос:
http://hashcode.ru/questions/126487/...%D1%82%D 1%8C

по коду есть несколько замечаний. так как используете jquery, то лучше написать так:

$(function() {
    $('#bb').click(function(){
        $("#text").toggle(); // ссылка на элемент text, говорим чтобы при клике менял видимость этого элемента
    });
});

[AllReady]

$(function() {
    $('#bb').click(function(){
        $("#text").toggle(); // ссылка на элемент text, говорим чтобы при клике менял видимость этого элемента
    });
});

Спасибо. На второй ответ не обратил внимания, т.к. рейтинг поста был -2, добавил в условие еще и || test.style.display == '' и все получилось. Про toogle я слышал, просто интересно было, почему все же не срабатывал код...