JSFiddle - React, Tailwind, and code Playground
HTML
<div id="person">Hai!</div>
JavaScript
// View the console to see results.
$.fn.person = function(prop) {
// just some default vals.
var defaults = $.extend({
name: 'Jane Doe'
}, prop);
// methods to be used outside of the plugin
var person = {
changeName: function(name) {
defaults.name = name;
},
getName: function() {
return defaults.name;
}
};
return person;
};
// set initial properties (setting name)
var person = $('#person').person({
name: 'Dennis Martinez'
});
// print initial name.
console.log('Initial name of person: ', person.getName());
// change the initial name.
person.changeName('Jane Doe');
// print the new name.
console.log('Changed name of person: ', person.getName());