JSFiddle - React, Tailwind, and code Playground

HTML

<form action="join-head-2-head.php" method="POST" enctype="application/x-www-form-urlencoded">    <table border="0" cellspacing="4" cellpadding="4">        <tr>          <td colspan="2"><input name="player1rules" type="radio" id="tandcy" value="y" />          <label for="tandcy">I  Have Reviewed The Rules And The Terms &amp; Conditions And Agree To Abide By Them</label></td>      </tr>        <tr>            <td colspan="2"><input name="player1rules" type="radio" id="tandcn" value="n" checked="checked" /><label for="tandcn">I Do Not Agree To The Terms And Condtions And/Or Have Not Read The Rules</label></td>        </tr>        <tr>            <td width="100"><input name="player1" type="hidden" value="<? $session->username; ?>" /></td>            <td><input type="submit" name="join" id="join" value="Take Available Slot" /></td>        </tr>    </table></form>

JavaScript

$(function () {
    var $join = $("input[name=join]");
    var processJoin = function (element) {
        if(element.id == "tandcn") {
            $join.attr("disabled", "disabled");
        }
        else {
            $join.removeAttr("disabled")
        }
    };
    
    $(":radio[name=player1rules]").click(function () {
        processJoin(this);
    }).filter(":checked").each(function () {
        processJoin(this);
    });
});