set timeout and cleartimeout(asynchronous)

 set timeout acts as a clock or alarm:

 if you want your clock to trigger after 5 sec thank set timeout triggers after 5 sec

syntax:

 setTimeout(function,time): here function is the function of css or HTML you want to target

   

 eg: if you want to change the background of ul after 5 sec than

    

// function changecss(){

//  document.getElementById("change").style.backgroundColor="red";

// }

// setTimeout(changecss,3000);

 this  function can be made short by using arrow function or keeping the function in same place

1. using function in same place

// setTimeout(function changecss() {

//  document.getElementById("change").style.backgroundColor="red";

    

// }, 3000);

2. using arrow function

var i=setTimeout(()=>{

    document.getElementById("change").style.backgroundColor="red";

},2000)

CLear timeout

    if you don't want to set alarm after setting alarm than you can control timing by clicking button of performing certain action in HTML

   note: you need to place the settimeout in a variable 

 and pass that variable in cleartimeout function

let clk=document.getElementById("click")

clk.addEventListener("click",stop)

function stop(){

    clearTimeout(i)

}