My custom code doesn't work in Elementor while in the browser it does - wordpress

Question

I created a simple calculator that converts two coin currencies. Everything seems to work just fine in my browser.
When I insert the HTML, CSS, and JS code into one of my pages on Elementor the functionality doesn't seem to work. When I click on the "Calculate" button nothing happens.
On my browser, the console.log(amount) shows the input number I entered while in Elementor it always shows 1 and the button doesn't do the calculation.
Does anyone have an idea what could be the issue?
Thank you.
function getExchangeRate(){
let amount = document.querySelector("form input");
const exchangeRateTxt = document.querySelector("form .exchange-rate");
// if user don't enter any value or enter 0 then we'll put 1 value by default in the input field
const amountValue = amount.value || "1";
amount.value = amountValue;
amount = parseFloat(amountValue);
if(amount == "" || amount == "0"){
amount.value = "1";
amount = 1;
}
console.log(amount)
exchangeRateTxt.innerText = "Getting exchange rate...";
if(fromCurrency.value == 'ILS'){
result = (amount * 3);
return exchangeRateTxt.innerText = `${result} MAD`;
}
if(fromCurrency.value == 'MAD'){
result = (amount /3);
return exchangeRateTxt.innerText = `${result.toFixed(2)} ILS`
}
}```