let container = document.getElementById("sickodds-odds-table");
let showAmericanOdds = false;

if (container !== null) {
  container.innerHTML = `<div class="comparison-table-new odds-comparison">
  <div class="table-head">
    <div class="first-row">
      <div class="cell game-col">Game</div>
      <div class="cell date-col">Date &amp; Tournament</div>
      <div class="cell odds-col">Teams &amp; Odds</div>
      <div class="cell">Bet Now</div>
    </div>
    <div class="cell second-row">
      <div class="switcher-box">
        American Odds Format:
        <label class="switcher">
          <input type="checkbox" kl_vkbd_parsed="true" id="so-american-check" />
          <span class="slider round"></span>
        </label>
      </div>
    </div>
  </div>
  <div class="table-body">

    


  </div>
</div>`;

  const check = document.getElementById("so-american-check");

  check.addEventListener("click", function (e) {
    const americanOdds = document.getElementsByClassName("so-american");
    const decOdds = document.getElementsByClassName("so-decimal");

    if (showAmericanOdds) {
      showAmericanOdds = false;

      for (let i = 0; i < americanOdds.length; i++) {
        const el = americanOdds[i];
        el.style.display = "none";
      }

      for (let i = 0; i < decOdds.length; i++) {
        const el = decOdds[i];
        el.style.display = "inline";
      }
    } else {
      showAmericanOdds = true;

      for (let i = 0; i < americanOdds.length; i++) {
        const el = americanOdds[i];
        el.style.display = "inline";
      }

      for (let i = 0; i < decOdds.length; i++) {
        const el = decOdds[i];
        el.style.display = "none";
      }
    }
  });
}