New to javascript, why won't my button work?

Question

Below is a quick function I wrote to check that the input supplied is equal to some pre-defined value. If it is, then it should display "Login Successful".

function getUsername(){
  var username = document.getElementById("userID").nodeValue;
  var password = document.getElementById("password").nodeValue;
  if (username=="example@example.com" && password=="123"){
  alert('Login Successful');
  }   
}

<input class="input100" type="text" name="username" placeholder="Username" 
id="userID">

<input class="input100" type="password" name="pass" placeholder="Password" 
id="password">

<Button class="login100-form-btn" onclick="getUsername()">Login</Button>

Answer 1

You should use .value for obtaining values of input elements:

function getUsername() {
  var username = document.getElementById("userID").value;
  var password = document.getElementById("password").value;
  if (username == "example@example.com" && password == "123") {
    alert('Login Successful');
  }
}

<input class="input100" type="text" name="username" placeholder="Username" id="userID">

<input class="input100" type="password" name="pass" placeholder="Password" id="password">

<Button class="login100-form-btn" onclick="getUsername()">Login</Button>