How to Disable a Button with jQuery

To disable a button with jQuery, add a disabled attribute to it with the prop() method.


To demonstrate this, let's create a button that gets disabled when clicked.


<button type="button" id="foo">Click me</button>
$('#foo').click(function() {
  $(this).prop('disabled', true);


The prop() method takes two arguments. The first is the name of the attribute and the second is its value. We can reenable a button by setting the disabled attribute to false like this:


<button type="button" id="foo" disabled>Disabled</button>

<button type="button" id="bar">Enable other button</button>
$('#bar').click(function() {
  $('#foo').prop('disabled', false).text('Enabled');