JavaScriptのonclickのエラーについて

前提・実現したいこと

JavaScriptで数当てゲームを作っています。
HTMLのボタン要素にonclickを入れると以下のようなエラーメッセージが出ます。
見つからないのはわかるんですがなぜHTML側の1行目と出るのかわかりません。
初心者にもわかるように教えていただけますか？

発生している問題・エラーメッセージ

Uncaught ReferenceError: judge is not defined
    index.html:1

HTML

<!DOCTYPE html>
<html lang="ja">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>数当てゲーム</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <script src="numcrunchingg.js"></script>
</head>
<body>

<center>
<h2 class="h2-a">数当てゲーム</h2>
    <p>０から100までの数字を当てるシンプルなゲームです。<br>
      ※半角数字で入力してください。</p>

      <section class="numcrunchingg">
        <input type="text" name="randomnumbern" id="randomnumberi" size="4">
        <input type="button" id="checkbutton" value="当ててみる" onclick="judge();">
        <section  id="output"></section>
      </section>


</center>

</body>

</html>

JavaScript

// 数当てゲーム
window.onload = function onload(){
let min = 1;
let max = 100;
var num;

num = Math.floor(Math.random() * (max + 1 - min)) +min;

console.log(num);

  const textbox = document.getElementById("randomnumberi");
  const answer = textbox.value;
}

function judge() {
    var flag = 0;
    if(document.randomnumberi.value.match(/^[0-9]+/)){
      flag = 1;
    }

    if(flag){
      window.alert("数字を半角で入力してください。");
    }

  var answerj = document.getElementById("output")

  if(this.num === this.answer) {
    answerj.innerHTML = "正解！";
  } else if (this.num > this.answer) {
    answerj.innerHTML = "もっと小さな数です";
  } else {
    answerj.innerHTML = "もっと大きな数です";
  }
}