Using input type password and image with selectors jQuery

We have two paragraphs with two types of input, one of type password and another image. We modify the width using css in jquery selecting the password input in position 0 and the image input in position 1.

<html>
  <body>
    <p>
      <input type="password" id="image" alt="Password" placeholder="Password"><br>
      <input type="image" id="image" alt="Like" 
             src="https://www.lookkle.com/blog/static/images/website-speed-test.JPG" 
             style="width: 150px;height: 30px;border-radius: 10px;border:2px solid #000;margin-top:5px;">
    </p>
	<p>
      <input type="password" id="image" alt="Password" placeholder="Password"><br>
      <input type="image" id="image" alt="Like" 
             src="https://www.lookkle.com/blog/static/images/website-speed-test.JPG" 
             style="width: 150px;height: 30px;border-radius: 10px;border:2px solid #000;margin-top:5px;">
    </p>
    <!--Script jQuery-->
    <script>
       $(document).ready(function(){
         $(':password').eq(0).css('width', '300px');
         $(':image').eq(1).css('width', '300px');
       });
    </script>
    <!--JQuery Library-->
    <script src="https://code.jquery.com/jquery-3.6.3.min.js"></script>
  </body>
</html>