I have a pricing page where I have a toggle to switch between annual and monthly. At the end, I am linking to a js file like this.

    <div class="top">
          <div class="toggle-btn">
            <span style="margin: 0.8em;">Annually</span>
            <label class="switch">
              <input type="checkbox" id="checbox" onclick="check()" ; />
              <span class="slider round"></span>
            </label>
            <span style="margin: 0.8em;">Monthly</span></div>
        </div>

<header><h2><em>Hobbyist</em></h2>
  <p class="pricing text1">$2 per month</p>  
  <p class="pricing text2">$1 per month billed yearly</p>
 </header>
  

   <script src="js/pricing.js"></script>
    <script src="js/main.js"></script>

And pricing js looks like this

function check() {
  var checkBox = document.getElementById("checbox");
  var text1 = document.getElementsByClassName("text1");
  var text2 = document.getElementsByClassName("text2");
  for (var i = 0; i < text1.length; i++) {
    if (checkBox.checked == true) {
      text1[i].style.display = "block";
      text2[i].style.display = "none";
    } else if (checkBox.checked == false) {
      text1[i].style.display = "none";
      text2[i].style.display = "block";
    }
  }
}

I'm getting an error in the console as a result the toggle is moving but not kicking in the required javascript function that makes the pricing move between $1 and $2 dollars. Can someone suggest me how to fix this? I'm quite new to programming.

Error

    Uncaught ReferenceError: check is not defined
    at HTMLInputElement.onclick ((index):74:74)