Почему не запускается функция по клику?

Question

[DanteIF]

Есть HTML

<div id="comment_chat_1" class="box"><div class="me"></div></div>
<div id="comment_chat_2" class="box"><div class="me"></div></div>
<div id="comment_chat_3" class="box"><div class="me"></div></div>

Есть CSS

.me {
    cursor: pointer;
    display: block;
    width: 10px;
    height: 10px;
    background: #f60;
    margin: 10px;
}

И есть Javascript

$('#comment_chat_1').click(fuction () {
for (var i = 0; i < 3; i++) {
    $('div.box').find('div.me').slice(i,i+1).delay(1000*i).fadeOut(1000);
}
});

Должно по клику скрывать поочерёдно блоки, так этот цикл без клика работает. Скажите пожалуйста, в чём проблема?

Answer 1

[Александр Филиппенко]

fuction => function

Answer 2

[Exploding]

function hideMe(){
	if($('.abc:visible').length){
		setTimeout(function(){
			$('.abc:visible:first').fadeOut(300);
			hideMe();
		},500);
	}
}
$(document).ready(function(){
	$('#buttonNext').on("click", function(){
		hideMe();	
	});
});

Comments

[Александр Филиппенко]

Тогда уж document ready, но никак не setInterval. На медленных компах чревато.

[Exploding]

Александр Филиппенко, док.реди это да, но функцию в него брать не надо. Только обработчик клика

[Александр Филиппенко]

Exploding, это да. Но там ошибка в другом на самом деле)

[DanteIF]

Exploding, я писал код для примера, на самом деле он огромней будет, а по поводу: fuction => function это я понял что его не правильно написал. Спасибо. Вот мой фрагмент уже переделанный:

$('a#buttonNext').click(function () {
			for(var i = 0; i<2;i++){
			
			setTimeout(
				function(){$('div#sliderWrapp').find('div.abc').slice(i , i+1).css('display', 'none')}, (100*i));		
			}
		
});

ингорирует delay и setTimeout. Не пойму просто в чём проблема...

[Exploding]

DanteIF, обновил ответ, чтоб нормально выглядел... не проверял правда, но должно работать.