JSFiddle - React, Tailwind, and code Playground

by Valentin Sarychev

HTML

<p>mithun</p>
<input name="writehere"  id="ch" type="text" class="jst" />
<input name="check" type="button" value="b1" id="b1"/>

JavaScript

(function($) {

// jQuery plugin definition
$.fn.reverseText = function(params) {

    // merge default and user parameters

    params = $.extend( {minlength: 0, maxlength: 99999}, params);

    // traverse all nodes
    this.each(function() {

        // express a single node as a jQuery object
        var $t = $(this);

        // find text
        var origText = $t.val(), newText = '';

        // text length within defined limits?
        if (origText.length >= params.minlength &&  origText.length <= params.maxlength) {

            // reverse text
            for (var i = origText.length-1; i >= 0; i--) newText += origText.substr(i, 1);
            $t.val(newText);

        }

    });

    // allow jQuery chaining
    return this;
};
})(jQuery);

$("#b1").click(function() {
    $('#ch').reverseText();
});