如何停止setTimeout中定义的方法执行

Question

I am facing one problem in JS, please help me to resolve this.. I have two methods they are simultaneously executing one after other.. I have to stop them after second click on image. Below is my JS code

I am calling fadeIn(img1, img2, img3) after first click on image then some animation will be goes on, once I click second time the whole animation(method execution) should be stopped.

var t1 = 0;
var t2 = 0;
function fadeIn(img1, img2, img3) {
$(imgIdForClick_1).addClass('animated pulse');
$('#cashBar1').addClass('animated pulse');
$('#cashBarDec1').addClass('animated pulse');

var t1 = setTimeout(function() {
    fadeOut(img1, img2, img3);
    if (clickCount_1 >= 2) {
        alert("clicked 1");
        return false;
    }
 }, 500);

 //t1 = setTimeout(fadeOut, 500);
};
function fadeOut(img11, img22, img33) {
$(imgIdForClick_1).removeClass('animated pulse');
$('#cashBar1').removeClass('animated pulse');
$('#cashBarDec1').removeClass('animated pulse');
var t2 = setTimeout(function() {
    fadeIn(img11, img22, img33);
    if (clickCount_1 >= 2) {
        alert("clicked 2");
        return false;
    } 
}, 500);

//t2 = setTimeout(fadeIn, 500);
};

By below code I am calling this snippet in first click

imgId1 = $('#img1');
        imgId2 = $('#cashBar1');
        imgId3 = $('#cashBarDec1');
        fadeIn(imgId1, imgId2, imgId3); 

After second click clickCount_1 varibale will be 2

clearTimeout(t1);
    clearTimeout(t2);

Answer 1

See the DEMO . Click on the image to stop animation. I have added a flag that would be checked upon the call of the function, and if the value is true then and then only the functions would be called. The flag would be set to false when clicked on image, so the function would be called no longer.

code:

var animate = true;
function fadeIn() {
    $('#pulseDiv').find('div#advisersDiv').delay(400).addClass("pulse");
    if(animate == true)
    {        
        setTimeout(fadeOut,1000);
    }
};

function fadeOut() {
    $('#pulseDiv').find('div#advisersDiv').delay(400).removeClass("pulse");
    if(animate == true)
    {
        setTimeout(fadeIn,1000);
    }    
};
fadeIn();

$('#image').click(function(){
    animate = false;
    alert('now the animation will stop');
});