JSFiddle - React, Tailwind, and code Playground

by denniswaltermartinez

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());