JSFiddle - React, Tailwind, and code Playground

HTML

<input type="password" value="test" name="pass" size="40">
   <br><br> 
    <a href="#">Click Me</a>

JavaScript

$.fn.passSwitch = function()
    {
        this.each(function(){
            if (this.tagName.toLocaleLowerCase() == 'input')
            {
                var el = $('<input>'),
                    th = $(this),
                    type = th.attr('type').toLocaleLowerCase() == 'password' ? 'text' : 'password';
                el.attr('type', type);
                for (var i = 0, len = this.attributes.length; i < len; i++)
                {
                    if (this.attributes[i].name.toLocaleLowerCase() != 'type')
                    {
                        el.attr(this.attributes[i].name, this.attributes[i].value);
                    }
                }
                el.val(th.val());
                th.replaceWith(el);
            }
        });
        return this;
    }
    
    $('a').click(function(){$('input').passSwitch()})