You can disable the <button> element in HTML by adding the disabled attribute to the element.
The disabled attribute is a boolean attribute that allows you to disable an element, making the element unusable from the browser.
You just need to add the disabled attribute without any value as shown below:
<button disabled>Click me</button>
Because the disabled attribute is a boolean attribute, you don’t need to assign any value to it.
When you need to enable the <button> later, you need to fetch the element using JavaScript and change the disabled property to false.
First, let’s add an id attribute to the <button> element above so you can select the element using JavaScript:
<button id="disabled" disabled>Click me</button>
Now you can enable the button by using the document.getElementById() method as follows:
document.getElementById("disabled").disabled = false;
You can also disable the button programmatically by setting the disabled attribute to true:
document.getElementById("disabled").disabled = true;
Once you have disabled a button, you can only enable it again by using JavaScript.