Build SOAP Body and Execute on Button Click using JavaScript [closed]

Need help in building the JavaScript code which will create a button and on button click build the SOAP body and then Execute the SOAP API. please suggest without <script> </script> or creating a local function.

here is the Sample JSON payload and SOAP API

SOAP API : https://XXXXXXX.fin.ZZZ.oraclecloud.com:443/fscmService/ErpIntegrationService

<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:typ="http://xmlns.oracle.com/apps/financials/commonModules/shared/model/erpIntegrationService/types/">
   <soapenv:Header/>
   <soapenv:Body>
      <typ:submitESSJobRequest>
         <typ:jobPackageName>/oracle/apps/ess/financials/receivables/transactions/shared/</typ:jobPackageName>
         <typ:jobDefinitionName>TransactionPrintProgramEss</typ:jobDefinitionName>
         <typ:paramList>11123456</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>ANY</typ:paramList>
         <typ:paramList>TRX_NUMBER</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>9876543</typ:paramList>
         <typ:paramList>9876543</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>N</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>PDF</typ:paramList>
         <typ:paramList>Inv_Template</typ:paramList>
         <typ:paramList>Default Credit Memo Template</typ:paramList>
         <typ:paramList>Default Debit Memo Template</typ:paramList>
         <typ:paramList>Default Chargeback Template</typ:paramList>
         <typ:paramList>N</typ:paramList>
         <typ:paramList>#NULL</typ:paramList>
         <typ:paramList>-1</typ:paramList>
      </typ:submitESSJobRequest>
   </soapenv:Body>
</soapenv:Envelope>

tried below code

<button id="myButton" onclick="const soapRequest="&lt;soapenv:Envelope xmlns:soapenv=&quot;http://schemas.xmlsoap.org/soap/envelope/&quot; xmlns:sch=&quot;http://xmlns.oracle.com/scheduler&quot; xmlns:typ=&quot;http://xmlns.oracle.com/scheduler/types&quot;&gt;&lt;soapenv:Header/&gt;&lt;soapenv:Body&gt;&lt;sch:submitRequest&gt;&lt;sch:description&gt;Prints invoice transactions&lt;/sch:description&gt;&lt;sch:jobDefinitionId&gt;&lt;typ:name&gt;InvoicePrintReport&lt;/typ:name&gt;&lt;typ:packageName&gt;/transactions/&lt;/typ:packageName&gt;&lt;typ:type&gt;BIPJobType&lt;/typ:type&gt;&lt;/sch:jobDefinitionId&gt;&lt;sch:application&gt;Receivables&lt;/sch:application&gt;&lt;sch:requestedStartTime&gt;2017-05-03T12:30:00&lt;/sch:requestedStartTime&gt;&lt;/sch:submitRequest&gt;&lt;/soapenv:Body&gt;&lt;/soapenv:Envelope&gt;";
const username="username";
const password = 'password';
  const url="https://www.google.combi/ess/esswebservice";
  fetch(url, {
    method: 'POST',
    headers: {
      'Content-Type': 'text/xml',
      'Authorization': 'Basic ' + btoa(username + ':' + password)nb
    },
    body: soapRequest,
  })
    .then(response => response.text())
    .then(data => {
      console.log(data);
    })
    .catch(error => {
      console.error(error);
    });
">Click me</button>