[sssema96]

Здравствуйте. Подскажите как правильно использовать функцию setTimeout() для моего кода:

function puskAvr(){
        let timer; // пока пустая переменная
        x =8; // стартовое значение обратного отсчета
        countdown(); // вызов функции
        function countdown(){  // функция обратного отсчета
            document.getElementById('timerAvr').innerHTML ='Таймер АВР 0,4кВ: ' + x;
            x--; // уменьшаем число на единицу
            if (x<0){
                clearTimeout(timer); // таймер остановится на нуле
            }
            else {
                timer = setTimeout(countdown, 1000);
            }
        }
 
    }
    let output_divs = [
        document.querySelector('.imgDKS1')
    ]
    document.querySelector('.button').addEventListener('click', e => {
        if (e.target.classList.contains('red_button_6')) {
            puskAvr();
           let links_arr = e.target.dataset.link.split(` `),
                tops_arr = e.target.dataset.top.split(` `),
                lefts_arr = e.target.dataset.left.split(` `)
            output_divs.forEach((el, i) => {
                el.insertAdjacentHTML('beforeEnd',
                    `<img src="${links_arr[i]}" style="position:relative; top:${tops_arr[i]}px;left:${lefts_arr[i]}px;">`
                )
            })
 
        }
    })

Задача в том что бы при нажатии red_button_6 запускался таймер с функции puskAvr(), и после того как переменная x достигнет 0 выполнить оставшуюся часть кода:

let links_arr = e.target.dataset.link.split(` `),
                tops_arr = e.target.dataset.top.split(` `),
                lefts_arr = e.target.dataset.left.split(` `)
            output_divs.forEach((el, i) => {
                el.insertAdjacentHTML('beforeEnd',
                    `<img src="${links_arr[i]}" style="position:relative; top:${tops_arr[i]}px; left:${lefts_arr[i]}px;">`
                )
            })