Как поставить задержку на создание элемента?

function actionofButton() {
  document.querySelector(.test12345).click();
  
  function genifybutt() {
 // setTimeout(genifybutt, 3000);                                          <--------------------
    var place = document.getElementsByClassName('k-tabBar-header')[0];

    var gendiv = document.createElement("li");
    var gena = document.createElement("a");
    var gens = document.createElement("span");
    gendiv.classList.add("k-tabBar-headerItem");
    gena.classList.add("main-navBar-navBarItem", "link-subtle", "main-navBar-navBarLink");
    gens.classList.add("ellipsis-one-line", "main-type-mestoBold");
    gena.setAttribute('onclick', 'window.location.href="https://google.com/"')
    gena.innerHTML = `Test`;
    gena.appendChild(gens);
    gendiv.appendChild(gena);
    gendiv.addEventListener("click", actionofgenifybutt)

    place.insertBefore(gendiv, place.secondElementChild)

  }
  genifybutt()

}

function actionofgenifybutt() {}

После клика на .test12345 создаётся элемент. Но нужно, что бы он создавался через 3 секунды. Я попробовал setTimeout(genifybutt, 3000); (указал в коде), но теперь почему то их создаётся два. Один сразу, а другой через 3 секунды. Почему так? При чем тот, что через 3 секунды - пропадает, если нажать, например, "Назад", а потом снова вернуться на страницу.

Подскажите пожалуйста, что не так, почему, и как сделать правильно, что бы создавался один, через 3 секунды, и не пропадал.


Ответы (1 шт):

Автор решения: Pilaton
!(function actionofButton() {
  function genifybutt() {
    var place = document.getElementsByClassName('k-tabBar-header')[0];

    var gendiv = document.createElement('li');
    var gena = document.createElement('a');
    var gens = document.createElement('span');
    gendiv.classList.add('k-tabBar-headerItem');
    gena.classList.add('main-navBar-navBarItem', 'link-subtle', 'main-navBar-navBarLink');
    gens.classList.add('ellipsis-one-line', 'main-type-mestoBold');
    gena.setAttribute('onclick', 'window.location.href="https://google.com/"');
    gena.innerHTML = `Test`;
    gena.appendChild(gens);
    gendiv.appendChild(gena);
    gendiv.addEventListener('click', actionofgenifybutt);

    place.insertBefore(gendiv, place.secondElementChild);
  }

  document.querySelector('.test12345').addEventListener('click', () => {
    setTimeout(genifybutt, 3000);
  });
})();

function actionofgenifybutt() {}
→ Ссылка