JSFiddle - React, Tailwind, and code Playground

by Osman Salihovic

HTML

<script src="https://code.jquery.com/jquery-2.2.3.js"></script>
<div id="div1">Div1</div>
<div id="div2">Div2</div>

JavaScript

;
(function($) {
  if (!$.myNamespace) {
    $.myNamespace = {};
  };

  $.myNamespace.myPluginName = function(el, myFunctionParam, options) {
    // To avoid scope issues, use "base" instead of "this"
    // to reference this class from internal events and functions.
    var base = this;

    // Access to jQuery and DOM versions of element
    base.$el = $(el);
    base.el = el;

    // Add a reverse reference to the DOM object
    base.$el.data("myNamespace.myPluginName", base);

    base.init = function() {
      base.myFunctionParam = myFunctionParam;

      base.options = $.extend({},
        $.myNamespace.myPluginName.defaultOptions, options);

      // Put our initialization code here
    };

    // Sample Function, Uncomment to use
    base.functionName = function(parameters) {
      alert('sample fnName');
    };
    // Run initializer
    base.init();
  };

  $.myNamespace.myPluginName.defaultOptions = {
    myDefaultValue: ""
  };

  $.fn.mynamespace_myPluginName = function(myFunctionParam, options) {
    alert('aa');
		return this.each(function() {
      (new $.myNamespace.myPluginName(this,
        myFunctionParam, options));
    });
  };
	
  $.fn.mynamespace_myPluginName2 = function(myFunctionParam, options) {
    alert('bb');
		return this.each(function() {
      (new $.myNamespace.myPluginName(this,
        myFunctionParam, options));
    });
  };	

})(jQuery);


(function($) {
  $("#div1").mynamespace_myPluginName();
	$("#div1").mynamespace_myPluginName2({
    myDefaultValue: "foobar"
  });	

})(jQuery);