DEMO: $.extend vs. $.fn.extend

by Adam Patridge

HTML

<p>Some sample text.</p>
<ul class="output">
</ul>

JavaScript

(function(jQuery) {
    $.extend({
        myExtendMethod: function(x) {
            $("<li>").text("$.extend: " + x).appendTo(".output");
        }
    });
    $.fn.extend({
        myFnExtendMethod: function(x) {
            $("<li>").text("$.fn.extend: " + x).appendTo(".output");
        }
    });
}($));
$(function() {
    var addError = function (msg) {
        $("<li>").text("error: " + msg).appendTo(".output");
    };
    ($.myExtendMethod ? $.myExtendMethod("test1") : addError("$.myExtendMethod doesn't exist"));
    ($.myFnExtendMethod ? $.myFnExtendMethod("test2") : addError("$.myFnExtendMethod doesn't exist"));
    ($("p").myExtendMethod ? $("p").myExtendMethod("test3") : addError("$(\"p\").myExtendMethod doesn't exist"));
    ($("p").myFnExtendMethod ? $("p").myFnExtendMethod("test4") : addError("$(\"p\").myFnExtendMethod doesn't exist"));
});