Hello friend I am Shyam and here we will discuss about how to create a button on password input type show and hide password on click by Javascript here is the source code of JS.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com
/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com
/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
   #showhide_eye{
    font-size: 29px !important;
    position: relative;
    top: 3px;
    left: -35px;
    cursor: pointer;
}
#showP{
	color: green;
    height: 26px;
    border: solid 2px;
    padding-right: 30px;
    width: 200px;
    }


</style>
<script>
$(document).ready(function(){
 
  $("#showhide_eye").click(function(){
   if("password" == $("#showP").attr('type'))
   {
      $("#showP").attr("type", "text");
		
    $("#showhide_eye").attr('class','fa fa-eye-slash');
   }
   else{
   $("#showP").attr("type", "password");
	$("#showhide_eye").attr('class','fa fa-eye');
    
    }
  });

 
});
</script>
</head>
<body>
<form>
<input type="password" id="showP" autocomplete="off">
  <i class="fa fa-eye" id="showhide_eye" style="font-size:36px"></i> 
<input type="reset" value="Clear">
</form>



</body>
</html>