Remove preventDefault() On A Click Event After 2 Seconds

I have a preventDefault() method on some links that I would like to remove after 2 seconds.

I'm trying to both work out how to remove the preventDefault() - which stops the links from working, but also how to do it so it happens after 2 seconds.

I thought I could do it by removing the 'link' class the initial forEach loop happens on, but alas this doesn't work.

Does anyone know how to solve this problem?

CodePen: https://codepen.io/emilychews/pen/VwPJNGE

var link = document.querySelectorAll(".link");    // prevent default on all specific links  link.forEach(function (item) {    item.addEventListener("click", function (e) {      e.preventDefault();    });  });    // remove prevent Default  function allowLinks() {    link.forEach(function (item) {      item.classList.remove("link");    });  }    setTimeout(allowLinks, 2000);

body {    margin: 0;    display: flex;    align-items: center;    justify-content: center;    width: 100%;    height: 100vh;  }

<a target="_blank" href="https://google.com" class="link">Make me work after 2 seconds</a>

https://stackoverflow.com/questions/67352061/remove-preventdefault-on-a-click-event-after-2-seconds May 02, 2021 at 08:43AM