Increment with remainder not working

Question

In my script the computer clicks through contact tabs in WhatsApp Web and for each checks whether the person is online or not. This is done with a loop, which starts again when contact number 16 is reached. Anyhow, the loop doesn't work and the variable 'i' doesn't increase. This is strange, since if I replace selectContact( ${i} ) by console.log, the increment works. Maybe the ${} prevents the i from updating?

var i = 1
setInterval(function () {
    selectContact(`${i}`)

    if (document.getElementsByClassName("O90ur")[0] !== undefined) {
    var online = document.getElementsByClassName("O90ur")[0].innerHTML
        if (online == "online") {
        console.log(`${i}`)};
                        }
    i = i % 16 + 1
}, 1000);

Here is the code for selectContact, if the issue should lie within here.

var jq = document.createElement('script');
jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);

contacts = [];
chat_div = [];

function triggerMouseEvent(node, eventType) {
    var event = document.createEvent('MouseEvents');
    event.initEvent(eventType, true, true);
    node.dispatchEvent(event);
}

function getChatname(){
    $("#pane-side > div > div > div").find("._2FBdJ >    div._25Ooe").each(function(){ 
        contacts.push($(this).text());
        chat_div.push($(this));
    })  
}

function selectContact(name){
    getChatname()
    for (i = 0; i < contacts.length; i++){
        if (name.toUpperCase() === contacts[i].toUpperCase()){
             triggerMouseEvent(chat_div[i][0],"mousedown")
        }
    }
}

Answer 1

You've missed out the var statement declaring i in your for loop, meaning it overwrites your global i .

function selectContact(name){
    getChatname()
    for (var i = 0; i < contacts.length; i++){
        if (name.toUpperCase() === contacts[i].toUpperCase()){
             triggerMouseEvent(chat_div[i][0],"mousedown")
        }
    }
}