title: why is my JQuery Toggle password visibility is not working?
body: <pre><code>&lt;p class="input-group pwdField"&gt;
     &lt;input type="password" name="password" placeholder="Enter your Password" required&gt;
     &lt;i class="fa fa-eye"&gt;&lt;/i&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p>This is my HTML markup and my jquery code is as below.</p>
  
  <pre><code>$(function() {
  
      $( ".input-group" ).children("i").click(function() {
  
          $( this ).toggleClass("fa-eye fa-eye-slash");
  
          var inputField = $(".pwdField").children().first();
  
          if ( $(inputField).attr("type", "password") ) {
  
              $(inputField).attr("type", "text");
  
          } else {
              $(inputField).attr("type", "password");
          }
  
      });
  
  }); // End of document.ready();
  </code></pre>
  
  <p>Please help me, when I am clicking the eye icon in the input field, everythng is working perfectly but when I click again, the input field is not changing its attribute back to type="password" from typee="text"</p>