JSFiddle - React, Tailwind, and code Playground

HTML

<table border="0" cellpadding="5" cellspacing="5" style="border: 1px solid #bbbbbb; width: 100%; ">
  <tbody>
    <tr>

		<td valign="top">
	                            
             <p>TRY TO TYPE STRING: TEXU3070079</p>
             <p>THE RESULT SHOULD BE IN GREEN. IF THE FORMAT IS WRONG THE RESULT IS RED.</p>
             <p>
               <input type='text' onkeyup="checkValid(this);" id='cont'  maxlength="11" class="form-control rounded-0" style="width: min-content; ">
          </p>  
                                                  
         </td>
      </tr>





			
				 
  </tbody>
</table>

JavaScript

function ContainerValidator()  {
    
    //SHS Constants addition
    var STR_PAD_LEFT = 'STR_PAD_LEFT';

    this.alphabetNumerical = {
        'A' : 10, 'B' : 12, 'C' : 13, 'D' : 14, 'E' : 15, 'F' : 16, 'G' : 17, 'H' : 18, 'I' : 19,
        'J' : 20, 'K' : 21, 'L' : 23, 'M' : 24, 'N' : 25, 'O' : 26, 'P' : 27, 'Q' : 28, 'R' : 29,
        'S' : 30, 'T' : 31, 'U' : 32, 'V' : 34, 'W' : 35, 'X' : 36, 'Y' : 37, 'Z' : 38
    };
    this.pattern = /^([A-Z]{3})(U|J|Z)(\d{6})(\d)$/;
    this.patternWithoutCheckDigit = /^([A-Z]{3})(U|J|Z)(\d{6})$/;
    this.errorMessages = [];
    this.ownerCode = [];
    this.productGroupCode;
    this.registrationDigit = [];
    this.checkDigit;
    this.containerNumber;

    /**
     * Check if the container has a valid container code
     *
     * @return boolean
     */
     this.isValid = function(containerNumber)
    {
        valid = this.validate(containerNumber);
        if (this.empty(this.errorMessages)) {
                                              document.getElementById("cont").style.borderColor = "#FF";
                                              document.getElementById("cont").style.backgroundColor = "#00d916";
                                              document.getElementById("cont").style.color = "#FFFFFF";
                                            }
                                            document.getElementById("cont").style.borderColor = "none";
                                            document.getElementById("cont").style.backgroundColor = "none";
                                            document.getElementById("cont").style.color = "#000000";
                                            return false;
    }






     this.validate = function(containerNumber)
    {

     

        matches = [];

        if (!this.empty(containerNumber) && this.is_string(containerNumber)) {
            matches = this.identify(containerNumber);

            if (this.count(matches) !== 5) {
               ...