Как остановить запуск функции таймера?
Я немного новичок в js и пытаюсь выяснить, как остановить эту функцию, когда я нажимаю на кнопку. Я попытался использовать clearInterval, но я не уверен, что делаю это правильно. Может кто-нибудь взглянуть на этот код и указать мне правильное направление?
Код:
<div><h1 id="target"></h1></div>
<button id="stop">Stop</button>
Автор сценария:
var arr = [ "one", "two", "three"];
(function timer(counter) {
var text = arr[counter];
$('#target').fadeOut(500, function(){
$("#target").empty().append(text).fadeIn(500);
});
delete arr[counter];
arr.push(text);
setTimeout(function() {
timer(counter + 1);
}, 3000);
$("#stop").click(function () {
clearInterval(timer);
});
})(0);
setInterval(timer);
JS Fiddle:http://jsfiddle.net/58Jv5/13/
Заранее спасибо за помощь.