JSFiddle - React, Tailwind, and code Playground
by Pavel Kityan
HTML
<div class="myContainer"><div class="content"></div></div>
<div class="myContainer"><div class="content"></div></div>
JavaScript
(function($){
$.fn.plugin1 = function(options) {
var methods = {
init : function() {
var elem = $(this);
elem.find('.content').css({width: '100px', height: '100px', background: 'red'});
}
};
if ( methods[options] ){
return methods[ options ].apply( this, Array.prototype.slice.call( arguments, 1 ));
}
else if ( typeof options === 'object' || ! options ){
return methods.init.apply( this, arguments );
}
}
$.fn.plugin2 = function(options) {
var methods = {
init : function() {
var elem = $(this);
elem.find('.content').css({width: '100px', height: '100px', background: 'blue'});
}
};
if ( methods[options] ){
return methods[ options ].apply( this, Array.prototype.slice.call( arguments, 1 ));
}
else if ( typeof options === 'object' || ! options ){
return methods.init.apply( this, arguments );
}
}
})(jQuery);
$(document).ready(function(){
$('.myContainer:eq(0)').plugin1();
$('.myContainer:eq(1)').plugin2();
});