javascript - Toggling height of single div in group of divs

Question

I have a number of divs with the same class on one page. I would like them to have a fixed height which expands to full height when clicking a toggle button. So far I have assembled a script from the internet which sort of does that, but currently it expands ALL divs on the page, not just the one div associated with the expand buttons. Could someone help me fix the script so it only expands one div, possibly resets the other one if it is expanded and toggles it back when the expand button is click again?

jQuery(document).ready(function($) {

    $.fn.toggleClick = function() {
        var functions = arguments;
        return this.click(function() {
            var iteration = $(this).data('iteration') || 0;
            functions[iteration].apply(this, arguments); 
            iteration = (iteration + 1) % functions.length; 
            $(this).data('iteration', iteration); 
            });
    };

var $dscr = $(".textblock"),
    $switch = $(".expand a"),
    $initHeight = 130; // Initial height

$dscr.each(function() {
    $.data(this, "realHeight", $(this).height());    // Create new property realHeight
    }).css({ overflow: "hidden", height: $initHeight + 'px' });

    $switch.toggleClick(function() {
      $dscr.animate({ height: $dscr.data("realHeight") }, 300);
      $switch.html("-");

    }, function() {
        $dscr.animate({ height: $initHeight}, 300);
        $switch.html("+");
    });

});

See my jsfiddle for the script so far: http://jsfiddle.net/N9DfH/1/

Answer 1

http://jsfiddle.net/N9DfH/21/

jQuery(document).ready(function () {

    $.fn.toggleClick = function () {
        var functions = arguments;
        return this.each(function () {
            var divel = $(this);
            $('.expand a', divel.parent()).click(function () {
                var iteration = $(this).data('iteration') || 0;
                functions[iteration].apply(divel, arguments);
                iteration = (iteration + 1) % functions.length;
                $(this).data('iteration', iteration);
            });
        });
    };

    var $dscr = $(".textblock"),
        $initHeight = 130; // Initial height

    $dscr.each(function () {
        $.data(this, "realHeight", $(this).height()); // Create new property realHeight
    }).css({
        overflow: "hidden",
        height: $initHeight + 'px'
    }).toggleClick(function () {
        this.animate({
            height: this.data("realHeight")
        }, 300);
    }, function () {
        this.animate({
            height: $initHeight
        }, 300);
    });
});