Find the longest element (jQuery)

Question

I use this script to equalize heights of elements:

(function ($) {
    $.fn.autoheight = function () {
        var height = 0,
            reset = $.browser.msie ? "1%" : "auto";
        return this.css("height", reset).each(function () {
            height = Math.max(height, this.offsetHeight);
        }).css("height", height).each(function () {
            var h = this.offsetHeight;
            if (h > height) {
                $(this).css("height", height - (h - height));
            };
        });
    };
})(jQuery);

I'd like to add just one extra functionality to it - addclass 'longest' to the longest element found when equalizing heights, what do I change in the above script?

Many thanks.

Answer 1

I remember stumbling across this site. Does this help? http://www.queness.com/post/126/useful-and-handy-jquery-tips-and-tricks

Read number 10. Columns of equal height.

Answer 2

Consider this more pseudo-code than anything as it hasn't been tested (or even run). Changed code inside //new code comment

(function ($) {
    $.fn.autoheight = function () {
        var height = 0,
            highest = 0, //new code
            reset = $.browser.msie ? "1%" : "auto";
        return this.css("height", reset).each(function () {
            height = Math.max(height, this.offsetHeight);
            //new code
            if (height > highest) {
              highest = height;
              $("*").removeClass("longest");
              $(this).addClass("longest"); 
            };
            //new code
        }).css("height", height).each(function () {
            var h = this.offsetHeight;
            if (h > height) {
                $(this).css("height", height - (h - height));
            };
        });
    };
})(jQuery);

Answer 3

Steve Claridge's above solution you say doesn't work - works fine for me; http://jsfiddle.net/ZqFp5/ (tested in chrome only)

Though using the

 $("*")

selector is somewhat inefficient in a large DOM, consider adding a class to the div's to use a more specific selector if possible.

 $(".foo")