I've been working on this JavaScript code that is supposed to log the information entered into the email and password fields onto the console, so I can later store it in a database.
The issue I'm facing is that when I run the code for the first time, everything works perfectly. However, on subsequent runs, only the last console.log() statement gets displayed.
I would really appreciate any help or advice on how to resolve this problem.
let email;
let password;
document.getElementById("loginBtn").onclick = function(){
email = document.getElementById("email").value;
console.log(email);
password = document.getElementById("password").value;
console.log(password);
}<div class="container" >
<h3 id="LogInToAcc" class="fonts"> Log into your account.</h3>
<hr>
<p class="fonts" id="accDont">Don't have an account?</p>
<a class="fonts" id="SignUp" href="signup.html"> Sign up!</a><br><br>
<label class="inputlabel" for="email">Email:</label> <br>
<input id="email" class="inputs" type="email" > <br><br>
<label class="inputlabel" for="password" >Password:</label> <br>
<input id="password" class="inputs" type="password" pattern=".{5,10}"> <br><br>
<a class="forgot" href="newpassword">Forgot your password?</a>
<a href="">
<button id="loginBtn" class="loginBtn" > Login</button> <br><br>
</a>
</div>
<script src="login.js"></script> I've tried different approaches like rearranging the code and declaring variables inside the function, but the issue persists.