JSFiddle - React, Tailwind, and code Playground

HTML

<p>Some paragraph text</p>
    <h1>some heading 1 text</h1>
    <h2>some heading 2 text</h2>

    <a href="#" class="sizer">12</a>
    <a href="#" class="sizer">14</a>
    <a href="#" class="sizer">16</a>

CSS

body {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 12px;
}

h1 {
  font-size: 1.5em;
}
h2 {
  font-size: 1.2em;
}

JavaScript

(function makeSizer() {
   var sizers = document.getElementsByClassName('sizer');
    for (var i = 0; i < sizers.length; i++) {
        sizers[i].onclick = function () {document.body.style.fontSize = this.innerHTML + "px";};
    }; // close for...
})(); // close makeSier;