JSFiddle - React, Tailwind, and code Playground

HTML

<input id="username" type="text" value="name">
<input type="submit" id="registerbttn" value="Register">

JavaScript

$('#username')
  // bind to a custom event triggered when validation of username succeeded
  .bind('checkValid', function() {
    alert('enabling the button');
    $('#registerbttn').removeAttr('disabled');
  })
  // bind to a custom event triggered when validation of username failed
  .bind('checkFailed', function() {
    alert('disabling the button');
    $('#registerbttn').attr('disabled', 'disabled');     
  });


// In your ajax handlers, if username was valid, trigger the valid event.
// This will call the checkValid handle we declared above and
// enable the button
$('#username').trigger('checkValid'); 

// If the username check failed though, trigger checkFailed instead
// which will call the handler above which disables the button
$('#username').trigger('checkFailed');