JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" id="enableButtonA"> Using 'disabled', 'disabled' <br />
<button id="myButtonA" disabled="disabled">Button A</button>
<br /><br />
<input type="checkbox" id="enableButtonB"> Using 'disabled', true <br />
<button id="myButtonB" disabled="disabled">Button B</button>

JavaScript

$(document).ready(function () {
    $('#enableButtonA').click(function (e) {
       if($(e.target).is(':checked'))
       {
           $('#myButtonA').removeProp('disabled');
           alert('Enable Button A');
       }
       else
       {
         $('#myButtonA').prop('disabled', 'disabled'); 
           alert('Disable Button A');
       }
    });
    
    $('#enableButtonB').click(function (e) {
       if($(e.target).is(':checked'))
       {
           $('#myButtonB').removeProp('disabled');
           alert('Enable Button B');
       }
       else
       {
           $('#myButtonB').prop('disabled', true); 
           alert('Disable Button B');
       }
    });
});