I have a grid that lists products. The grid is three columns wide, but it could grow to be four or five columns wide. I've written my script to count the columns. The markup is something like this:<ul>    <li class=item first>...</li>    <li class=item>...</li>    <li class=item>...</li>    <li class=item first>...</li>    <li class=item>...</li>    <li class=item>...</li></ul>In the project, I can't change the markup. I can however write JavaScript/jQuery any which way I please. What I have is working, but I'm using four loops. Since my JS chops aren't too hot, I'm not convinced that what I have is particularly fast or concise.jQuery(document).ready(function ($) {use strict;var maxItemHeight,    firstItem = $('.item.first'),    gridRow = [],    i;firstItem.each(function () {    gridRow.length = 0;    maxItemHeight = 0;    gridRow.push($(this));    $(this).nextUntil(firstItem).each(function () {        gridRow.push($(this));    });    for (i = 0; i < gridRow.length; i++) {        maxItemHeight = (gridRow[i].find('h2').outerHeight() > maxItemHeight) ? gridRow[i].find('h2').outerHeight() : maxItemHeight;    };    for (i = 0; i < gridRow.length; i++) {        gridRow[i].find('h2').css('height', maxItemHeight);    };  });});How could this be improved?
Iterating through each grid row and matching elements to largest height
javascript;jquery
Can't say if this is much faster, but it's more concisejQuery(document).ready(function($) {    use strict;    var firstItems = $('.item.first');    firstItems.each(function() {        var $first, row, headings, heights, maxHeight;        $first = $(this);        // Get collection of columns        row = $first.add($first.nextUntil(firstItems));        // Find each column's heading        headings = row.find(h2);         // Get the heights of the headings        heights  = headings.map(function () {            return $(this).outerHeight();        }).toArray();        // Get the maximum        maxHeight = Math.max.apply(null, heights);        // Set the heading heights to the maximum        headings.css(height, maxHeight);    });});--Edit--In my particular instance, the above script had conflict issues with prototype, since it lives inside a Magento install. I sought help and found this improvement./Jezen