JSFiddle - React, Tailwind, and code Playground

by pricejt

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<form action="/action_page.php">
  First name:<br>
  <input type="text" name="firstname" value="Mickey">
  <br>
  Last name:<br>
  <input type="text" id="lastname" name="lastname" value="Mouse">
  <br><br>
  <input type="button" value="change to drop down" onclick="$('#lastname').changeElementType('select');">
</form>

JavaScript

(function($) {
    $.fn.changeElementType = function(newType) {
        var attrs = {};
        $.each(this[0].attributes, function(idx, attr) {
            attrs[attr.nodeName] = attr.nodeValue;
        });
        this.replaceWith(function() {
            return $("<" + newType + "/>", attrs).append($(this).contents());
        });
    }
})(jQuery);