JSFiddle - React, Tailwind, and code Playground

HTML

<h1 id="a1">Header 1</h1>
<h2 id="a2">Header 2</h2>
<h3 id="a3">Header 3</h3>
<h4 id="a4">Header 4</h4>
<h5 id="a5">Header 5</h5>
<button onclick="replaceHTML()">Click to Replace</button>

JavaScript

function replaceHTML(){
    var elements = document.querySelectorAll('h1,h2,h3,h4,h5');
    Array.prototype.slice.call(elements).forEach(function(element){
        var text = element.tagName+'. Header';      element.parentNode.insertBefore(document.createTextNode(text),element); element.parentNode.insertBefore(document.createElement('br'),element);
        element.parentNode.removeChild(element);
    })
}