listening to change in variable values and handling click event

Question

For the first 3 secs the variable x has value 0 and after 3 secs the x value is set to 1.

Whenever we click the button in between 0 and 3 secs, function handleClick should not be called. Whenever we click the button in after 3 secs, function handleClick should be called.

Below is the HTML and JS code that i am using. But the function handleClick is not called even after 3 secs.

HTML:

<button class="quizy-mg-item">click here</button>

JS:

var x=0;
setTimeout(3000,function(){
x=1 
})
function handleClick(){
document.write("Success");
}
if(x) {
$('.quizy-mg-item').click(handleClick);
}

Answer 1

Try this code,

setTimeout(function() {
  $('.quizy-mg-item').click(handleClick);
},3000);

function handleClick(){
  document.write("Success");
} 

Your setTimeout function's order of argument was wrong.

Also here,

if(x) {
  $('.quizy-mg-item').click(handleClick);
}

At the time of condition check inside if , x is actually 0, hence no click handler is attached. It has nothing to do with value of x later.

ps Dont use document.write , use console.log to debug.