JSFiddle - React, Tailwind, and code Playground

HTML

<p id="bottles">9 bottles of beer on the wall</p>
<button id="take">Take one down and pass it around</button>
<button id="again">Start again</button>

JavaScript

var para = $('#bottles'),
    take = $('#take'),
    again = $('#again'),
    bottles = 99;

function update() {
    if (bottles > 0) {
        take.show();
        again.hide();
    } else {
        take.hide();
        again.show();
    }
    
    if (bottles > 1) {
        para.text(bottles + ' bottles of beer on the wall');
    } else if (bottles === 1) {
        para.text('One bottle of beer on the wall');   
    } else {
        para.text('No bottles of beer on the wall');
    }
}

take.click(function () {
    bottles--;
    update();    
});

again.click(function () {
    bottles = 99;
    update()
});

update();