JSFiddle - React, Tailwind, and code Playground

HTML

<button id="add">Add Controls</button>
<button id="remove">Remove Controls</button>
<div>
<audio></audio>
</div>

CSS

div {
    background-color: Red;
}

JavaScript

var audio = document.querySelector('audio');

document.querySelector('#add').addEventListener('click', function()
{
    audio.setAttribute('controls', 'controls');
});

document.querySelector('#remove').addEventListener('click', function()
{
    audio.removeAttribute('controls');
});