JSFiddle - React, Tailwind, and code Playground

HTML

<form action="#">
    <input type="checkbox" id="agreed" /> text<br />
    <span style="position:relative;">
      <input type="submit" id="submit" disabled />
      <div style="position:absolute; left:0; right:0; top:0; bottom:0; cursor: pointer;" ></div>
    </span>
</form>

JavaScript

$("div").click(function (evt) {
    if($("#submit").is(':disabled'))
        alert("Ops");
});

$("#agreed").click(function(){
    if($("#submit").is(':disabled'))
    {
        $("#submit").removeAttr("disabled");
        $("div").hide();
    }
    else
    {
        $("#submit").attr("disabled", "disabled");
        $("div").show();
    }

});