隣り合うブロック要素の高さを揃えるJavaScript

よーし久々に書いてみるぞー。wktk
divで表を作る時に、中身が可変長な場合、同列内のdivで高さがずれちゃうのを何とかしたい。

例えばこんな感じでdivが並んでるとする。
（divはfloatで横並び）

<div id="rows_1">
  <div class="col">
    hoge<br>hoge<br>hoge<br>hoge<br>hoge
  </div>
  <div class="col">
    hoge<br>hoge<br>hoge<br>hoge
  </div>
  <div class="col">
    hoge<br>hoge<br>hoge
  </div>
  <div class="col">
    hoge<br>hoge
  </div>
  <div class="col">
    hoge
  </div>
</div>

左から順に高さが低くなって表が崩れちゃうので、JavaScriptで高さを揃える。

function getElementByClassName(elm, searchClass, tag) {
  var returnArr = [];
  tag = tag || '*';
  var elms = elm.getElementsByTagName(tag);
  var pattern = new RegExp('(^|\\s)'+searchClass+'(\\s|$)');
  for(var i = 0; i < elms.length; i++) {
    if(pattern.test(elms[i].className)) {
      returnArr.push(elms[i]);
    }
  }
  return returnArr;
}

function getHeight(elm) {
  return (document.all) ? elm.offsetHeight : elm.clientHeight;
}
                                                               
function resetHeight(cols) {
  var height = getHeight(cols[0]);
  var len = cols.length;
  for(var i = 1; i < len; i++) {
    var h = getHeight(cols[i]);
    if(h > height) height = h;
  }
  for(var i = 0; i < len; i++) {
    cols[i].style.height = [height, "px"].join("");
  }
  return;
}
                                                               
window.onload = function() {
  var arr = [];
  for(var i = 1; i < 5; i++) {
    var row = $id('rows_'+i);
    if(row) {
      var cols = getElementsByClassName(row, 'col', 'div');
      if(cols.length > 0) {
        resetHeight(cols);
      }
    } else {
      return false;
    }
  }
}

とすれば、colクラスをつけた横並びのdivの高さが一番高いdivの高さに揃う。
親divにrows_1、rows_2とかidを振って列を増やしていくと表になります。

っていうのをカレンダー作ろうと思って試してみましたー
for分で5回ループさせているのは1月につき5列必要だったからです。

IEを除くならXPathでid="rows"なdivを取得して個数分回すとかもありかも！