vertically aligning text in the middle of various divs

Hi I have some text below an image within a varied sized divs, the text is already horizontally centered but I would like to center this text vertically as well as horizontally using jquery.

how would I do this?

below is the example page

http://satbulsara.com/luke-irw开发者_StackOverflow中文版in/?page_id=175

Thanks,

Sat

Here an example and a fiddle how to center vertically: http://jsfiddle.net/9Aqd8/

<div style="height:120px; width:120px; border: 1px solid black">
    <div class="textToAlign" style="text-align:center; width:100%">Text</div>
<div>

$(function() {
    $('.textToAlign').each( function( index, item) {
         var parent = $(item).parent();
         var $this = $(item);
         parent.css('position', 'relative');
         $this.css('position', 'absolute').css('top', Math.round((parent.height() - $this.outerHeight()) / 2) + 'px');
    });
});

CSS solution:
http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks

JQuery solution:

a. Change the HTML structure for all the boxes to this:

<div class="wp-caption alignnone">
  <div class="imageContainer">
    <img class="new geometric ikat" title="Rug-3" src="http://satbulsara.com/luke-irwin/wp-content/uploads/2011/05/Rug-31.jpg" alt="" width="308" height="409" />
  </div>
  <p class="wp-caption-text">Testing 4</p>
</div>

b. JQuery Code:

var maxHt = 0;
var $containers = $('div.imageContainer');
$containers.each(function(){
  var ht = $(this).height();
  if (ht > maxHt) {
    maxHt = ht;
  }
});
$containers.height(maxHt);