Set timeout() method is not working when defining an index after the function name in HTML?

I have a problem with executing a set timeout on a function in HTML
I will show you 2 examples one that works the other simply ignore the set timeout method

Working example :
A: onclick="setTimeout(hideBtn, 1000)"
in this example the hidenBtn does not have and index() attached to it and the 1sec delay simply works.

Problematic example :
B: onclick="setTimeout(hideBtn(0), 1000)"
in this example once I define and array index after the function the set time get ignored and the function executes right on click.

do you see any problem with the syntax ?

I will link the whole function from the JS file because I tried to set the set Time out from there but and error occur saying the whole function is not defined ?
since I need the index to be defined I cannot go with working example.
thanks for help.

let g = document.querySelectorAll(".populating-btns");

function hideBtn(index) {
    for (let i = 0; i < g.length; i++) {
        g[index].style.display = "none";
    }
};
<div id="removeA" class="populating-btns">
        <div class="add-btn-extend" onclick="setTimeout(hideBtn(0), 1000)">
            <span>Hide1</span>
        </div>
    </div>
    
    
    <div id="removeB" class="populating-btns">
        <div class="add-btn-extend" onclick="setTimeout(hideBtn(1), 1000)">
            <span>Hide2</span>
        </div>
    </div>

.

33 thoughts on “Set timeout() method is not working when defining an index after the function name in HTML?”

  1. 735104 872354This style is incredible! You undoubtedly know how to keep a reader amused. Between your wit and your videos, I was almost moved to start my own blog (nicely, almostHaHa!) Amazing job. I genuinely loved what you had to say, and more than that, how you presented it. Too cool! 948221

    Reply

Leave a Comment