Set counter per element in jQuery plugin

Question

When you set a counter in a jQuery plugin it will be set per instance of the plugin. For instance

$.myPlugin(\".one\");
$.myPlugin(\".two\");

$.myPlugin = funct         


        

Answer 1

You can use .data() to custom associated with your elemet

Store arbitrary data associated with the matched elements or return the value at the named data store for the first element in the set of matched elements.

Code

$.myPlugin = function (el) {
    $(el).click(function () {
        var counter = $(this).data('counter') || 1;
        console.log(counter);
        $(this).data('counter', ++counter);
    });
};

DEMO

I personally would like it this way

$.fn.myPlugin = function () {
    this.click(function () {
        var counter = $(this).data('counter') || 1;
        console.log(counter);
        $(this).data('counter', ++counter)

    });
};

$(".one").myPlugin();
$(".two").myPlugin();

DEMO