JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Trac ticket 7620</title>
 </head>
<body>
  <div id="FELG01A88B002C92ACADABC" repeat_template="application.spouse">              
        <fieldset class="leftLabels">                  
          <div id="FEL2BCAAC36F91BDB98DF18">
            <label class="desc">Spouse Name:</label>
            <input type="text" maxlength="35" size="25" name="application.spouse.firstname">
          </div>                
        </fieldset>        
      </div>
  
  <div id="FELG01A88B002C92ACADABD" repeat_template="application.parent">
              <legend>$application.parent.phone</legend>
        <fieldset class="leftLabels">                    
          <div id="FEL2BCAAC36F91BDB98DF19">
            <label class="desc">Parent Name:</label>
            <input type="text" maxlength="35" size="25" name="application.parent.firstname">
          </div>                
        </fieldset>        
      </div>
</body>
</html>

JavaScript

function isBlank(text) {  
    text = $.trim(text);
    return text == null || text == '';
}       
$(document).ready(function(){  
//select spouse div
//modify div id with new one by appending [FEIEI2C90]
//traverse each element to modify each inner element    
        var repeatablesection = $("[repeat_template='application.spouse']");        
        $.each(repeatablesection,function(){
          var element = $(this);
          var elementId = element.attr("id");          
          var elementName = element.attr("name");  
          if(!isBlank(elementId)){
            element.attr("id",elementId+"[FEIEI2C90]");
            alert("spouse outer id="+element.attr("id"));
          }                  
          $("*",element).each(function(){
            var childelement = $(this);
            var childelementId = childelement.attr("id");
            var childelementName = childelement.attr("name");  
            if(!isBlank(childelementId)){
              childelement.attr("id",childelementId+"[FEIEI2C90]");
              alert("spouse inner id="+childelement.attr("id"));
            }
            if(!isBlank(childelementName)){
              childelement.attr("name",childelementName+"[FEIEI2C90]");
              alert("spouse inner name="+childelement.attr("name"));
            }          
            
          });
        });
    
 //select parent div
//modify div id with new one by appending [0]
//traverse each element to modify each inner element 

       var parentrepeatablesection = $("[repeat_template='application.parent']");        
        $.each(parentrepeatablesection,function(){
          var element = $(this);
          var elementId = element.attr("id");          
          var elementName = element.attr("name");  
          if(!isBlank(elementId)){
            element.attr("id",elementId+"[0]");
            alert("parent outer id="+element.attr("id"));
          }                 
          $("*",element).each(function(){
            var...