JSFiddle - React, Tailwind, and code Playground

HTML

<form id="start_run" method="put" name="start_run">
  <fieldset style="width:380px;"><legend>Create/Update a Run</legend>
   <input type="hidden" name="user_name" value="test"/>
   <input type="hidden" name="password" value="test"/>
   <input type="hidden" name="started" value=""/>
   <input type="hidden" name="milestones" value="HiddenMileStone"/>
   <table cellspacing="0" cellpadding="0" border="0">
       <tr><td colspan="2">Contract:
           <select name="contract_id">
           <option value="99">99</option>
           <option value="100">100</option>
           </select> Batch<input type="text" name="batch_code" size="25"/>
       </td></tr>
       <tr>
       <td colspan="2">As of: <input type="text" value="" id="datepicker3" name="as_of_date" maxlength="10" size="8"/>
        &nbsp;Stat:<select name="run_status">
           <option value="READY">Ready</option>
           <option value="INPROGRESS">InProgress</option>
           <option value="PAUSED">Paused</option>
           <option value="COMPLETED">Completed</option>
           <option value="FAILED">Failed</option>
           </select>
       </td>
       </tr>
       <tr><td colspan="2">Ended<input type="text" value="" id="datepicker4" name="as_of_date" maxlength="10" size="8"/>
       lastMod:<input type="text" name="last_modified" value="" size="15"/>
     </td>
       </tr>
       <tr><td align="right">Hostname:</td><td><input type="text" value="" name="host_name"  maxlength="25" size="30"/></td></tr>
       <tr><td colspan="2">
           Run code: <input type="text" name="run_code"  size="15"/>
           Name:     <input type="text" id="nameId" name='name'  size="10" />
       </td>
       </tr>
     <tr><td colspan="2" align="right"><button type="button" onclick="doStartRun(this.form);return false;">Start Run</button></td></tr>
   </table>
  </fieldset>
</form>

JavaScript

function doStartRun(formId) {
     var xmlString = bldRequestXML(formId);
      alert(xmlString);      
  }
  

function bldRequestXML(formId) {
    var params =$("#"+formId).serialize()
    var ppairs = params.split('&');
    var xmlString = '<?xml version="1.0" encoding="UTF-8"?>';
    xmlString = xmlString + '<!DOCTYPE reports>';
    xmlString = xmlString + '<request>';
    var keyValue;
    for(var i=0; i<ppairs.length;i++) {
       keyValue=ppairs[i].split("=") ;
       xmlString = xmlString + "<" + keyValue[0] + ">";
       xmlString = xmlString +  keyValue[1];
       xmlString = xmlString + "</" + keyValue[0] + ">";
   }
   xmlString = xmlString + '</request>'
   return (xmlString);
 }