JSFiddle - React, Tailwind, and code Playground

by Garry Passarella

HTML

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<input type="text" data-uppercase="1" />

JavaScript

$(function() {
        $("[data-uppercase='1']").on('keypress', function (e) {
            var $this = $(this);
            var placeholder = $this.attr('placeholder');
            if(placeholder && placeholder.length > 0) {
                this["_placeholder"] = placeholder;
                $this.attr('placeholder', '');
            }
            $this.css('text-transform', 'uppercase');
        }).on('keyup blur', function () {
            var $this = $(this);
            if ($this.val().length < 1) {
                $this.css("text-transform", "");
                $this.attr("placeholder", this["_placeholder"]);
                this["_placeholder"] = undefined;
            }
        });
    });