JSFiddle - React, Tailwind, and code Playground

HTML

<form>
    <input id="name" />
    <input type="submit" value="submit" />
</form>

JavaScript

var filter = {
    filters: {},

    add: function (tag, filter) {
        (this.filters[tag] || (this.filters[tag] = [])).push(filter);
    },

    apply: function (tag, val) {
        if(this.filters[tag]){
            var filters = this.filters[tag];
            for(var i = 0; i < filters.length; i++){
                val = filters[i](val);
            }
        }
        return val;
    }
}

$('form').submit(function(e){
    e.preventDefault();
    var name = $('#name').val();
    name = filter.apply('modify_name', name);
    $('#name').val(name);
});

filter.add('modify_name', function(name){
    name = 'MR. ' + name;
    return name;
});

filter.add('modify_name', function(name){
    name = 'Hello: ' + name;
    return name;
});