JSFiddle - React, Tailwind, and code Playground

HTML

<button class="activation">
   Click to reveal more content
 </button>


<!-- Voice reader will read above button as 'Click to reveal more content, button' -->

<!-- However when revealing/showing this div below it says "New Content" without the tag of "button" at the end -->
<button aria-hidden="true" class="newButton hidden" role="button">
  New Content
</button>

CSS

.hidden{
  opacity:0;
}

JavaScript

const activeButton = document.querySelector('.activation');
const newButton = document.querySelector('.newButton');

 activeButton.addEventListener('click',function testFunc() {
    newButton.setAttribute("aria-live","polite");
    newButton.removeAttribute("aria-hidden");
    newButton.classList.remove("hidden");
  }
)