JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/themes/redmond/jquery-ui.css">
<link rel="stylesheet" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/css/ui.jqgrid.css">
<script src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/js/i18n/grid.locale-en.js"></script>
<script src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/js/jquery.jqGrid.min.js"></script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>GDPR (Subscripciones)(CATALAN)</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta http-equiv="Expires" content="0" />
    <meta http-equiv="Cache-Control" content="no-cache" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    
    
    
    
  </head>


  <body>
    <div class="clickdform mainDiv" style="margin-top:10px;margin-left:10px;margin-bottom:0px;margin-right:0px;padding:0px;">
      <form id="clickdimensionsForm" name="clickdimensionsForm" method="post" accept-charset="utf-8" action="https://analytics.clickdimensions.com/forms/?visitor=contact"><input type="HIDDEN" name="cd_accountkey" id="cd_accountkey" value="aEpgPgRTYHkW4M24mTaghR" /><input type="HIDDEN" name="cd_domain" id="cd_domain" value="foment.com" /><input type="HIDDEN" name="cd_visitorkey" id="cd_visitorkey" value="" /><input type="HIDDEN" name="cd_visitoremail" id="cd_visitoremail" value="" /><input type="HIDDEN" name="cd_timezone" id="cd_timezone" value="" /><input type="HIDDEN" name="cd_cldunsub" id="cd_cldunsub" value="" /><input type="HIDDEN" name="cd_domainalias" id="cd_domainalias" value="" /><input type="HIDDEN" name="cd_postsettings" id="cd_postsettings"...

CSS

/*--- BODY STYLE ---*/
body
{
margin:0px;
padding:0px;
-webkit-text-size-adjust: 100%;
}

/*--- FORM CONTAINER STYLE ---*/
.mainDiv
{
float:left;
}

/*--- FIELD INPUT STYLE ---*/
.clickdform input[type='text'],
.clickdform textarea,
.clickdform select
{
    font-family:"Verdana" !important;
    font-size:13px !important;
    color:#333;
    margin:0;
    padding:2px 0;
    border-top:1px solid #7c7c7c;
    border-left:1px solid #c3c3c3;
    border-right:1px solid #c3c3c3;
    border-bottom:1px solid #ddd;
}

/*--- LIST DROPDOWN STYLE ---*/
.clickdform select
{
	height:26px;
}

/*--- SUBMIT BUTTON STYLE ---*/
#btnSubmit
{
    margin: 15px 0 0 0;
    font-family:Verdana;
    font-size:13px;
    clear:both;
}

/*--- PREVIOUS BUTTON STYLE ---*/
.clickdform .WizardPrevButton{
    margin: 15px 10px 0 0;
    font-family:Verdana;
    font-size:13px;
    float:left;
}

/*--- NEXT BUTTON STYLE ---*/
.clickdform .WizardNextButton
{
    margin: 15px 0px 0 0;
    font-family:Verdana;
    font-size:13px;
    float:right;
    clear:both;
}

.hideMe{
visibility: hidden;
}

JavaScript

clickd_jquery(document).ready(function(){

clickd_jquery('#f_3de11423fb72e81191ce005056b24941').prop("checked", false);

//PRIMERA FUNCIÓN (SI)

clickd_jquery("#f_3de11423fb72e81191ce005056b24941").change(function(){
if (clickd_jquery("#f_3de11423fb72e81191ce005056b24941").prop('checked')){

clickd_jquery("#cd_unsuball").prop("disabled", true);
}else{
clickd_jquery("#cd_unsuball").prop("disabled", false);
}


});

//SEGUNDA FUNCIÓN (NO)

clickd_jquery("#cd_unsuball").change(function(){
if (clickd_jquery("#cd_unsuball").prop('checked')){

clickd_jquery("#f_3de11423fb72e81191ce005056b24941").prop("disabled", true);
}else{
clickd_jquery("#f_3de11423fb72e81191ce005056b24941").prop("disabled", false);
}


});


});