Textbox highlighted issue in create.js

When I click the first audio button, the first textbox of the word should be highlighted. However, when I click the audio button again, the first textbox of that word is not highlighted, instead, the highlight appears somewhere else. Sometimes, the highlighter works correctly, but other times, it does not highlight the respective textbox properly

var yr2_chaptertextarray = ["väg", "vägg", "glas", "glass"];

var yr2_soundsArr = [
    bloburl + "/audio1.mp3",
    bloburl + "/audio2.mp3",
    bloburl + "/audio3.mp3",
    bloburl + "/audio4.mp3",
];

shuffle(yr2_chaptertextarray, yr2_soundsArr);


var count = 0;
for (var i = 0; i < 10; i++) {
    for (var j = 0; j < 1; j++) {
        var posX = i > 4 ? 900 : 400;
        var posY = i > 4 ? -102 : 298;

        var yr2_audio_container1 = new createjs.Container();
        let audiobutton1 = new createjs.Bitmap(audiobutton_1);
        audiobutton1.setTransform(posX, posY + (i * 80));
        audiobutton1.cursor = "pointer";

        yr2_audio_container1.addChild(audiobutton1);
        yr2_audio_container1.id = count;
        yr2_audio_container1.click = 0;
        yr2_audio_container1.name = "removeimage";
        yr2_audio_container1.on("click", checkaudio);

        stage.addChild(yr2_audio_container1);
        count++;
    }
}

var textBoxes = [];
var answercorrect = 0;
var wordPositions = [];

// Combine words and store their positions
let combineword = '';
for (let j = 0; j < yr2_chaptertextarray.length; j++) {
    let word = yr2_chaptertextarray[j];
    let position = combineword.length;
    combineword += word;
    wordPositions.push({ word, position });
}

// Function to check audio on click
function checkaudio(event) {
    event.currentTarget.click++;

    if (event.currentTarget.click > 1) {
        sounds[event.currentTarget.id].load();
        sounds[event.currentTarget.id].play();
        resethighlighter();
        startingpos(event);
    } else {
        resethighlighter();
        sounds[event.currentTarget.id].load();
        sounds[event.currentTarget.id].play();

        let QstnTxtArr;
        let Qstn = createQstnArr(yr2_chaptertextarray[event.currentTarget.id], 872, 690, 90, 0);
        QstnTxtArr = Qstn[event.currentTarget.id];

        let Xpos = event.currentTarget.id > 4 ? 1008 : 510;
        let yaxis_box = event.currentTarget.id > 4 ? -100 : 300;

        for (let col = 0; col < yr2_chaptertextarray[event.currentTarget.id].length; col++) {
            let xaxis_box = Xpos + (col * 50);

            let textBoxtemp = new createjs.Container();
            let textBox_rectangle = new createjs.Shape();
            textBox_rectangle.graphics.setStrokeStyle(2).f('#FFFFFF').beginStroke('#F08300').drawRoundRect(0, 0, 50, 50, 0);
            textBox_rectangle.setTransform(xaxis_box, yaxis_box + (event.currentTarget.id * 80));

            let textBox_highlighter = new createjs.Shape();
            textBox_highlighter.graphics.setStrokeStyle(2).f("#FDF5CE").beginStroke('#F08300').drawRoundRect(0, 0, 50, 50, 0);
            textBox_highlighter.setTransform(xaxis_box, yaxis_box + (event.currentTarget.id * 80));
            textBox_highlighter.visible = (col === 0);

            var textBoxText = new createjs.Text("", "63px MajemaSkol_Exercise_bold", "#808080");
            textBoxText.textAlign = 'center';
            textBoxText.x = xaxis_box + 25;
            textBoxText.y = yaxis_box + 35 + (event.currentTarget.id * 80);
            textBoxText.textBaseline = "alphabetic";

            textBoxtemp.addChild(textBox_rectangle, textBox_highlighter, textBoxText);
            textBoxtemp.name = "removeimage";
            textBoxtemp.textBoxText = textBoxText;

            textBoxtemp.on('click', function (evt) {
                document.getElementById("temp_textbox").style.display = "block";
                $("#temp_textbox").val("").focus();

                if (answercorrect === 0) {
                    for (var i = 0; i < textBoxes.length; i++) {
                        textBoxes[i].children[1].visible = false;
                        textBoxes[i].isClicked = false;
                    }
                    evt.currentTarget.children[1].visible = true;
                    evt.currentTarget.isClicked = true;
                }
            });

            textBoxes.push(textBoxtemp);
            if (col === 0) textBoxtemp.isClicked = true;

            stage.addChild(textBoxtemp);
        }
    }
}

// Function to reset highlighters
function resethighlighter() {
    for (var j = 0; j < textBoxes.length; j++) {
        textBoxes[j].isClicked = false;
        textBoxes[j].children[1].visible = false;
    }
}

// Function to start highlighting correct position
function startingpos(event) {
    console.log(wordPositions);
    if (wordPositions[event.currentTarget.id].word === yr2_chaptertextarray[event.currentTarget.id]) {
        textBoxes[wordPositions[event.currentTarget.id].position].isClicked = true;
        textBoxes[wordPositions[event.currentTarget.id].position].children[1].visible = true;
    }
}