Question

Jquery:

$(document).ready(function () {
    $('#myfirstDiv').click(function () {
        $('#seconDiv').fadeIn("fast");
    });
    $('#closeBtn').click(function () {
        $('#seconDiv').fadeOut("fast");
    });
});

there is multiple usage of these functions in my site, with different ids for Div and Buttons.
How could I generalize these functions for every Div and Button?

Answer 1

Here’s a plugin that takes in the second div and the button to close it:

(function($) {
    $.fn.extend({
        FadeInOut: function(divTwo, closeBtn) {
            return this.each(function() {
                $(this).click(function() {
                    $(divTwo).fadeIn("fast");
                });
                $(closeBtn).click(function() {
                    $(divTwo).fadeOut("fast");
                });
            });
        }
    });
})(jQuery);

DEMO