CSS and JS: How to prevent “event.target.innerText” from deleting inside tag

For example, I have a tag like:

<p><a href="mailto:[email protected]">[email protected]</a></p>

When it runs through this:

const repetitions = setInterval(x => {
      originalText = event.target.innerText;
      splitText = event.target.dataset.value.split("");
      event.target.innerText = splitText.map((character, index) => {
        
      if (index < i) {
        return event.target.dataset.value[index];
      } else {
        return codeSymbols[Math.floor(Math.random() * 26)]
      }

It deletes the inner a tag and leaves it with. <p>[email protected]</p>

The event is based off of observing:

const hiddenElements = document.querySelectorAll("h1, h2, p, a");
hiddenElements.forEach(ele => {
  observer.observe(ele);
})

I believe the observing event detects a p, then it targets the p tagname in event.target.tagname, deleting the inner a tag.

How would I prevent this from happening?