JSFiddle - React, Tailwind, and code Playground

HTML

<table width="100%" cellspacing="0" cellpadding="3" border="0"> 
    <tbody> 
        <tr> 
            <td valign="top" style="text-align: right;" class="address_labels"> 
                <label><span>*</span> First Name: </label> 
            </td> 
            <td> 
                <span id="ctl00_CMain_txtFirstName_wrapper"><input type="text" style="width: 190px;" invalidstyle="inputError" class="radEnabledCss Input" name="ctl00_CMain_txtFirstName_text" id="ctl00_CMain_txtFirstName_text" size="20" value=" zdogg"><input type="text" value=" zdogg" style="border: 0pt none ; margin: -18px 0pt 0pt; padding: 0pt; overflow: hidden; visibility: hidden; width: 1px; height: 1px;" name="ctl00$CMain$txtFirstName" id="ctl00_CMain_txtFirstName"><input type="hidden" name="ctl00_CMain_txtFirstName_ClientState" id="ctl00_CMain_txtFirstName_ClientState" autocomplete="off"></span> 
                <div> 
                    <span style="color: Red; display: none;" class="inputError" id="ctl00_CMain_valFirstName">First name is required</span> 
                </div>         
            </td> 
        </tr> 
        
    </tbody></table>  
<input type="button" value="showerror" id="showit"/>

JavaScript

$('#showit').click(function(){
    $('.inputError').show();
    $('span.inputError:visible').each(function() { 
        $(this).parent().parent().prev('td').children('label').children('span').css('color','red'); 
    });
});