How to hide password from user when password protecting a page [closed]

How Can I Hide The Passcode so someone can’t just inspect the element to view the password?

function onSubmit() {
    if (document.getElementById('password').value == '12345678') {
      window.location.href = 'http://google.co.in'; 
    }else{ 
      alert('Please check your passcode and try again');
    }
}

<fieldset>
 <form class="hero-form" action="#">
    <div class="row-fluid">
      <label>Enter your passcode</label>
      <input type="password" name="password" maxlength="8" class="span7" id="password" placeholder="e.g. 12345678" required/>
    </div>
 </form>
</fieldset>
<button class="btn btn-info btn-large span5" id="joe_btn" onclick="onSubmit()">Enter</button>

Answer

There is no foolproof way to prevent people from accessing the password via inspect element (or other means). To fix this, generally, you will want to store the password on a server. And when the user submits the form, the password the user entered should be sent to the server, which should then check to see if the two passwords are equal.

This is a general overview of how it is usually done. It does not mention details like encryption or hashing. That being said, encryption and hashing are very important for password security, and should not be overlooked.