Drupal 6: Using jQuery to ensure Panel columns are the same height

I recently implemented the Panels module to create a page layout with 3 columns. I added background images to the columns, repeating on the y axis to span the entire length of the column. The problem I encountered: you cannot predict how tall the content will be in your columns and they will be staggered. To provide a more uniform styling, I added some jQuery to find the tallest column and set the shorter ones to the max height.

$(document).ready(function(){

  // keep track of the tallest column
  var tallest = 0;

  // loop through columns and find the tallest
  $('#panel_other_programs .panel-panel').each(function(){
    if ( $(this).outerHeight(true) > tallest )
      tallest = $(this).outerHeight(true);
  });

  // loop through columns and adjust height as necessary
  $('#MY-PANEL-UNIQUE-IDENTIFIER .panel-panel').each(function(){

    // check if current column needs to be adjusted
    if ( $(this).outerHeight(true) < tallest ) {
      // set new height
      $(this).height( tallest );
    }
  });

});

Now all the columns should have a uniform height and the backgrounds should all span the entire length of each column.