Disabling and enabling a html input button

Question

So I have a button like this:

<input id="Button" type="button" value="+" style="background-color:grey" onclick="Me();"/> 

How can I disable and enable it when I want? I have tried disabled="disable" but enabling it back is a problem. I tried setting it back to false but that didn't enable it.

Answer 1

Using Javascript

• Disabling a html button

  document.getElementById("Button").disabled = true; 

• Enabling a html button

  document.getElementById("Button").disabled = false; 

• Demo Here

---

Using jQuery

All versions of jQuery prior to 1.6

• Disabling a html button

  $('#Button').attr('disabled','disabled'); 

• Enabling a html button

  $('#Button').removeAttr('disabled'); 

• Demo Here

All versions of jQuery after 1.6

• Disabling a html button

  $('#Button').prop('disabled', true); 

• Enabling a html button

  $('#Button').prop('disabled', false); 

• Demo Here

P.S. Updated the code based on jquery 1.6.1 changes. As a suggestion, always use the latest jquery files and the prop() method.