JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/dot-luv/jquery-ui.css">
<a id="click">click here</a>
<a id="click2">click here2</a>
<p id="test1">Test 1</p>
<p id="test2">Test 2</p>
JavaScript
(function($) {
$.fn.setColorTest = function(options) {
var defaults = { color: '#000' }; //getting overwritten, needs to be per instance
options = $.extend(defaults, options);
return this.each(function() {
$(this).css({ 'color': options.color});
console.log(defaults.color);
});
}
})(jQuery);
$('a#click').click(function() {
$('#test1').setColorTest();
return false;
});
$('a#click2').click(function() {
$('#test2').setColorTest({color: '#fff666'});
return false;
});