JSFiddle - React, Tailwind, and code Playground

HTML

<div id="1">
    <h1>Hello, world</h1>
</div>

<input type="button" id="2" value="Alert div height">
<input type="button" id="3" value="Add 1px padding">

JavaScript

var hasPadding = false;

var alertDivHeightButton = document.getElementById('2');
alertDivHeightButton.onclick = alertDivHeight;
var togglePaddingButton = document.getElementById('3');
togglePaddingButton.onclick = togglePadding;

function alertDivHeight () {
    var div = document.getElementById('1');
    alert("width of div: " + div.offsetHeight);
}

function togglePadding () {
    var div = document.getElementById('1');
    if (hasPadding) {
        div.style.padding = '0px';
        togglePaddingButton.value = "Add 1px padding";
    } else {
        div.style.padding = '1px';
        togglePaddingButton.value = "Remove 1px padding";
    }
    hasPadding = !hasPadding;
}