Edit in JSFiddle

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jshashes/1.0.7/hashes.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
</head>
<body>

<script>
function checkBreachedPassword() {
  var password = document.getElementById("pass").value;
  var passwordDigest = new Hashes.SHA1().hex(password);
  var digestFive = passwordDigest.substring(0, 5).toUpperCase();
  var queryURL = "https://api.pwnedpasswords.com/range/" + digestFive;
  var checkDigest = passwordDigest.substring(5, 41).toUpperCase();
  var result;

$.ajax({
    url: queryURL,
    type: 'GET',
    async: false,
    success: function(res) {
    	if (res.search(checkDigest) > -1){
        result = false;
        document.getElementById("result").innerHTML = "Result: Breached"
      } else {
        result = true;
        document.getElementById("result").innerHTML = "Result: Not Breached <redirected>"
      }
    }
  });
  return result;
}
</script>

<form action="#" onsubmit="return checkBreachedPassword();" style="margin:auto auto 50px auto;">
  Enter password: 
  <input id="pass" type="password" name="password">
  <input type="submit" value="Submit">
</form>

<p id="result">Result: </p>

</body>
</html>