I have this JS:
document.getElementById("config2").addEventListener("click", function(){
config3();
console.log("In Function config.onclick()...");
});
function config3()
{
document.body.innerHTML+="<div style=\"opacity:0;\" class=\"popoutcont\" id=\"formcont\"><div style=\"opacity:0;\"><div class=\"popoutform\"></div></div>";
setInterval(function(){document.getElementById("formcont").style.opacity+=0.01;if(document.getElementById("formcont").style.opacity===1){clearInterval(this)}}, 1);
console.log("In Function Config...");
}
And this HTML:
<p class='spectxt' style='font-weight:normal;' id='config2'><strong>Payload Configuration:</strong> Seats: 2</p>"
First of all, the event never occurs. No output is sent to the console. Second, the Chrome DevTools JS Console says that config3 is undefined when I call the function. Why is this happening and what is causing it?
run your startup code on
since your html content is not loaded yet