Select Token To Swap video. swap is not working. javascript dex tutorial

hello everyone.

i decided too make new post with this issue. as my other issue is solved. im in the javascript dex tutoriol and my swap button is not working like in the video this is my code up too this point

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


        <!-- Moralis SDK code -->
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/web3.min.js"></script>
        <script src="https://unpkg.com/[email protected]/dist/moralis.js"></script>

        <title>Moralis Dex </title>
        <link rel="stylesheet" href="style.css">

</head>


<body>
    
    
    

    <h1>MoralisSwap</h1>

    <button id="btn-login">Moralis Login</button>
    <button id="btn-buycrypto">Buy Crypto</button>
    <button id="btn-logout">Logout</button>


    <table>
        <thead>
            <tr>
                <th>#</th>
                <th>Symbol</th>
                <th>Amount</th>
                <th>Action</th>


            </tr>

        </thead>

        <tbody class ="js-token-balances"></tbody>

    </table>

    <form action="#" method="POST" class="exchange-form">
        <div class="form-row">

        <label>


            <span class ="js-from-token"></span>
            Amount:
            <input type ="text" name="from-amount" class="js-from-amount" disabled  />
        </label>

        <div class="js-amount-error error"></div>
        </div>
        <div class="form-row">
            <button type="submit" class="js-submit" disabled > Get Qoute</button>
            <button class="js-cancel" disabled > Cancel</button>
        </div>
        <div class="js-qoute-container"></div>
        
    </form>




    <script src="./dex.js"></script>

</body>
</html>
// connect to Moralis server

    const serverUrl = "https://hzgprsd3s1da.usemoralis.com:2053/server";
    const appId = "YwMvfUyGm50mRIrKsXsWCwlkPjQxji5zCuVNP3xe";
    Moralis.start({ serverUrl, appId });

    Moralis
        .initPlugins() 
        .then ( () => console.log ('plugins have been initialized ') );

    const $tokenBalanceTBody = document.querySelector('.js-token-balances');
    const $selectedToken =document.querySelector('js-from-token');
    const $amountInput= document.querySelector('.js-from-amount');

    //Converting  from wei  using custom function 
    const tokenValue = (value, decimals) => (decimals ? value / Math.pow(10, decimals): value);

   // add from here down
   async function login() {
    let user = Moralis.User.current();
    if (!user) {
      user = await Moralis.authenticate();
    }
    console.log("logged in user:", user);
  }

  async function getStats() {
    const balances = await Moralis.Web3API.account.getTokenBalances({
      chain: "polygon",
      address:"0x0D0707963952f2fBA59dD06f2b425ace40b492Fe"
    });
    console.log(balances);
  
    document.querySelector(".js-token-balances").innerHTML += balances
      .map(
        (token, index) => `
      <tr>
        <td> ${index + 1}</td>
        <td> ${token.symbol}</td>
        <td> ${token.amount}</td>
        <td> ${Moralis.Units.FromWei(token.balance, token.decimals)}</td>
        <td>
        
        <button 

            class="js-initSwapForm"
            data-address="${token.token_address}"
            data-symbol="${token.symbol}"
            data-decimals="${token.decimals}"
            data-max="${tokenValue(token.balance, token.decimals)}"

            >

            Swap
            </button>
        
        
        </td>
      </tr>`
      )
      .join("");
  }


  async function initSwapForm (event) {
    event.preventDefault();
    $selectedToken.innerText = event.target.dataset.symbol;
    $selectedToken.dataset.address =  event.target.dataset.address;
    $selectedToken.dataset.decimals =  event.target.dataset.decimals;
    $selectedToken.dataset.max =  event.target.dataset.max;
    $amountInput.removeAttribute('disabled');
    $amountInput.value = '';
    document.querySelector('.js-submit').removeAttribute('disabled');
    document.querySelector('.js-cancel').removeAttribute('disabled');
    document.querySelector('.js-qoute.container').innerHTML = '';


  }

  

for ( let $btn of  $tokenBalanceTBody.querySelectorAll('js-initSwapForm')) {
$btn.addEventListener('click',swap);

}




  async function buycrypto () {
    Moralis.Plugins.fiat.buy ();



  }

  async function logOut() {
    await Moralis.User.logOut();
    console.log("logged out");
  }

  document.getElementById("btn-login").onclick = login;
  document.getElementById("btn-buycrypto").onclick =buycrypto;
  document.getElementById("btn-logout").onclick = logOut;



  async function getTop10tokens() {
    const response = await fetch(" https://api.coinpaprika.com/v1/coins ");
    const tokens = await response.json();
  
    let result = tokens
      .filter((token) => token.rank <= 10)
      .map((token) => token.symbol);
  
    return result;
  }
  
  async function gettickerdata(top10Tokens) {
    const response = await fetch("https://api.1inch.exchange/v3.0/137/tokens");
    const tokens = await response.json();
    const tokenlist = Object.values(tokens.tokens);
  
    return tokenlist.filter((token) => top10Tokens.includes(token.symbol));
  }
  
  getTop10tokens()
    .then((top10Tokens) => gettickerdata(top10Tokens))
    .then(console.log);
    getStats();
.error {

    color: darkred;
}

does anyone have any suggestions too how too fix this?

does this have something to do with my swap button?

Do you get any errors? Which tutorial are you following? There should be a link to a finished project repo where you can compare your code.

i dont get any errors. its the 2021 javascript programming for blockchain developers

this is what it looks like

Thanks. Since this is a locked course I don’t have a frame of reference for what is going on and it looks like there’s no errors. You can post on the Moralis Academy Forum with your issue if you haven’t already.