Keep getting Uncaught type error: cannot read properties of undefined (reading 'style') error is JS

Question

Trying to switch from a Login form and a Register form. Keep getting error from Javascript:

Uncaught type error: cannot read properties of undefined (reading 'style')

Not sure what else to look at according to this error. Have tried JS as a .js file, same issue.

Code:

<div class="col-2">
  <div class="form-container">
    <div class="form-btn">
      <span onclick="login()"> Login </span>
      <span onclick="register()">Register</span>
      <hr id="Indicator">
    </div>



    <form id="LoginForm">
      <input type="text" placeholder="Username">
      <input type="password" placeholder="Password">
      <button type="submit" class="btn">Login</button>
      <a href="">Forgot Password</a>
    </form>

    <form id="RegForm">
      <input type="text" placeholder="Username">
      <input type="email" placeholder="Email">
      <input type="password" placeholder="Password">
      <button type="submit" `enter code class="btn">Register</button>
    </form>

    <script>
      var LoginForm = document.getElementbyID("LoginForm");
      var RegForm = document.getElementbyID("RegForm");
      var Indicator = document.getElementById("Indicator");

      function register() {

        LoginForm.style.transform = "translateX(0px)";
        RegForm.style.transform = "translateX(0px)";
        Indicator.style.transform = "translateX(100px)";

      }

      function login() {

        LoginForm.style.transform = "translateX(300px)";
        RegForm.style.transform = "translateX(300px)";
        Indicator.style.transform = "translateX(0px)";

      }
    </script>

Answer 1

var LoginForm = document.getElementbyID("LoginForm");
var RegForm = document.getElementbyID("RegForm");
var Indicator = document.getElementById("Indicator");

there are typos at your selector. it should be

document.getElementById(id);