JSFiddle - React, Tailwind, and code Playground

by Gerald Gillespie

HTML

<div id="test"> hi</div>

JavaScript

(function($) {
    var _cfg = { //globals
        "_n": "testit"
    },
        m = {
            cfg: { // defaults
                "option1": 4

            },
            init: function(cfg) {
                return this.each(function() {
                    var $this = $(this);
                    $this.data('testit', {
                        "somethingelse": 2
                    });
                    $this.data(_cfg._n, $.extend({}, m.cfg, cfg, $this.data(_cfg._n)));
                    $this.testit('mymethod', {
                        "something": 1
                    }).css('font-size', '3em');
                    alert('hi');
                }); //end each 
            },
            // end init
            mymethod: function(d) {
                return this.each(function() {
                    var $this = $(this);
                    $this.text(d.something); //1
                    $this.after($this.data(_cfg._n).option1); // 3
                    $this.after('<br/>');
                    $this.after($this.data('testit').somethingelse); //2
                }); // end each
            } // end mymethod
        };

    $.fn.testit = function(method) {
        if (m[method]) {
            return m[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return m.init.apply(this, arguments);
        } else {
            $.error('Method ' + method + ' does not exist on jQuery.testit');
        }
    };

})(jQuery);


$('#test').testit({
    "option1": 3
});