Run a equalHeight plugin on click
<p>I have created a plugin to set equal heights on divs. this is excecuted on page load(called the function in dom ready). </p>

<p>Now, what I am looking for is on click of a button I would like to run the plugin again to set equal heights due to some error messages, content in one of the boxes has increased...so by running the function again I can make the boxes have equal height again.</p>

<p>Any help much appreciated. </p>

<pre><code>HERE IS THE CODE:
&lt;div class="xyz"&gt;
 &lt;div class="boxes"&gt;
  &lt;input type="submit" value="apply" class="abc" /&gt;
 &lt;/div&gt;

 &lt;div class="boxes"&gt;&lt;/div&gt;

 &lt;div class="boxes"&gt;&lt;/div&gt;
&lt;/div&gt;
----------------------------

$(document).ready(function () {
 if($('.xyz').length) {
   $('.boxes').sameHeight();
 }
});


jQuery.fn.sameHeight = function () {
    var maxSize = 0;

    this.each(function () {
        var currSize = $(this).height();
        if (currSize &gt; maxSize) {
            maxSize = currentSize;
        }
    });

    return $(this).height(maxSize);
};


$('.abc').live('click', function (e) {
  $(this).each(function (event) {
    if($('.xyz').length) {
     $('.boxes').sameHeight();
    }
  });
});
</code></pre>
