what does “Uncaught ReferenceError: createCookie is not defined,” mean?

On my website, when I press the submit button it spits back this error “Uncaught ReferenceError: createCookie is not defined” at line 61, what do I do to fix it? for context,
this is the full HTML script:

gggggggg.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Mestre de Inglês - Curso Completo</title>
</head>
<body>
  <h1 align=center style="height: 20px;">Mestre de Inglês - Curso Completo</h1>
  <h2 align=center style="height: 25px;">Simples, Facil, e Grátis</h2>
  <h1 align=center style="height: 75px;">Aprenda Inglês dentro de um ano</h1>
  
  <div>
    <div>
      <h2 align=center style="height: 20px;">Aplicar para participação</h2>
    </div>
    <div>
      <h3 align=center style="height: 10px;">Email</h2>
    </div>
    
    <Email>
      <div style="height: 10px; display: flex; flex-direction: row; align-items: center; justify-content: center;">
        <input type="email" name="Email" id="Email" autocomplete="on">
      </div>
    </Email>

    <div>
      <h3 align=center style="height: 10px;">Username</h2>
    </div>

    <Username>
      <div style="height: 10px; display: flex; flex-direction: row; align-items: center; justify-content: center;">
        <input type="text" name="Username" id="Username" maxlength="20" minlength="5" autocomplete="on">
      </div>
    </Username>
    
    <div>
      <h3 align=center style="height: 10px;">Password</h2>
    </div>

    <Password>
      <div style="height: 10px; display: flex; flex-direction: row; align-items: center; justify-content: center;">
        <input type="text" name="Pass" id="Password" maxlength="20" minlength="5">
      </div>
    </Password>
    
    <div>
      <h3 align=center style="height: 10px;">Skill Level</h2>
    </div>

    <Skill style="height: 10px; display: flex; flex-direction: row; align-items: center; justify-content: center;">
      <select name="Skill Level" id="Skill">
      <option value="Noob">Noob</option>
      <option value="Beginner">Beginner</option>
      <option value="Intermidiate">Intermidiate</option>
    </select>
    </Skill>
    
    <Button>
      <div style="display: flex; flex-direction: row; align-items: center; justify-content: center;">
        <input type="button" onclick="createCookie()" value="submit">
      </div>
    </Button>
    
    
  </div>
    
</body>
</html>

this is the script responsible for user login and cookies
gggggggg.js

function createCookie(email,username,pwd,skill){
    let email = document.getElementById("Email");
    let username = document.getElementById("Username");
    let pwd = document.getElementById("Password");
    let skill = document.getElementById("Skill");
  
  
    today = new Date();
    var expire = new Date();
    expire.setTime(today.getTime() + 3600000*24*15);
   
  
    document.cookie = "email="+encodeURI(email.value)+";path=/" + ";expires="+expire.toUTCString();
    document.cookie = "username="+username.value+";path=/" + ";expires="+expire.toUTCString();
    document.cookie = "password="+encodeURI(pwd.value)+";path=/" + ";expires="+expire.toUTCString();
    document.cookie = "skill="+skill.value+";path=/" + ";expires="+expire.toUTCString();
    //can only write one entity at a time (name, pass, skill)
  }  
  
  
  //event handler for page load - runs on every refresh
  window.onload = function(){
  
    document.getElementById('Username').value = uname;
    document.getElementById('Password').value = pass;
    document.getElementById('Skill').value = skill;
    
    console.log(email,username,pwd,skill)
  }

I used a truck load of research for the html and copy-pasted an answer I found here with some edits for the javascript, but when I press the submit button I get back an error saying the function is undefined, any help would be appreciated

i didnt really try much, I emmidiately thought “I should go to stack overflow”