What is the problem in code that alerts pop-up if I don’t enter my ID or password?

I want to make a program that If I don’t enter my ID or password, an alert pops up, and if my password is less than 6 characters, an alert pops up.

When I ran this code, the ‘Fill in the blank’ and ‘Enter the password with at least 6 characters’ alerts always appeared even if I type letters in the ID and password boxes. If the condition is false, the alerts should not be displayed, but why does it appear? I don’t know what the problem is.

<form action=”success.html”>

<div class = “my-3”>
<input type = “text” class = “form-control” id=”id” placeholder=”Fill in the blank”>
</div>
<div class=”my-3″>
<input type = “password” class = “form-control” id=”pw” placeholder=”Enter the password with at least 6 characters”>
</div>

<button type = “submit” class = “btn btn-primary”>전송</button>
<button type = “button” class = “btn btn-danger” id=”close”>닫기</button>

</form>

<script>
var Text1 = $(‘#id’).val();
var Password1 = $(‘#pw’).val();
var passwordLength = $(‘#pw’).val().length;

$(‘form’).on(‘submit’, function() {
if ( Text1 == ” || Password1 == ”) {
alert(‘Fill in the blank’)
}

if (passwordLength < 6){
alert(‘Enter the password with at least 6 characters’)
}
}
)

</script>