He terminado de escribir este código en un 99%, pero estoy atascado en el último obstáculo.

El problema principal aquí es: tengo 2 botones HTML que tienen como objetivo cambiar el texto en función de la salida de la función, con éxito o no. Actualmente, la lógica de las funciones funciona, es decir, los valores devueltos esperados son los esperados. Sin embargo, cuando trato de mover estas funciones a mi archivo HTML, se ejecutan automáticamente, lo que sobrescribe el valor predeterminado y anula el punto de tener el botón.

Botón:

 <button id="goldButton" onclick = "${calcGoldTierStatus(exampleCustomer)}">Click me!</button> <h2 id="goldResult">Gold tier eligibility:${goldTierEligible}</h2>

Función anterior en el mismo script.js:

 function calcSilverTierStatus() { if ( exampleCustomer.previousStays >= silverTier.previousStays && exampleCustomer.bookingAgencyId === null || String || Number && (exampleCustomer.roomSpend / (exampleCustomer.roomSpend.length+=1)) >= 100 && exampleCustomer.reservationNights >= silverTier.previousStays ) { silverTierEligible = ("Silver Eligibility:Eligible for Silver tier!") } else { silverTierEligible= ("Silver Eligibility:Not eligible for Silver Tier") } }

Lo que puede ser digno de mención es que estoy pasando los valores a HTML declarando un 'contenido' const, luego usando:

document.body.innerHTML = content;

para escribir el cuerpo HTML. Parece ser el $(calcGoldTierStatus(exampleCustomer)} que está causando la ejecución automática, pero no tenía idea de cómo mover la función a HTML desde JS.