JSFiddle - React, Tailwind, and code Playground

HTML

<h3>default behaviour</h3>
<ul id="list1">
    <li class="alert alert-info">
        <h1>heading 1</h1>
        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
        <a class="btn btn-primary pull-right" href="#">Link</a>
    </li>
    <li class="alert alert-error">
        <h1>heading 2</h1>
        <p>Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
        <a class="btn btn-danger pull-right" href="#">Link</a>
    </li>
    <li class="alert alert-success">
        <h1>heading 3</h1>
        <p>
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
        <a class="btn btn-success pull-right" href="#">Link</a>
    </li>
</ul>

<h3>with children option</h3>
<ul id="list2">
    <li class="alert alert-info">
        <h1>heading 1</h1>
        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
        <a class="btn btn-primary pull-right" href="#">Link</a>
    </li>
    <li class="alert alert-error">
        <h1>heading 2</h1>
 ...

CSS

@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');

body {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 10px;
}

li {
    float: left;
    margin-bottom: 20px;
    margin-left: 20px;
    padding: 5px;
    width: 180px;
}

JavaScript

;(function($) {

  $.fn.equalize = function(options) {
    var $containers = this, // this is the jQuery object
        children    = false,
        reset       = false,
        equalize,
        type;

    // when options are an object
    if ($.isPlainObject(options)) {
      equalize = options.equalize || 'height';
      children = options.children || false;
      reset    = options.reset || false;
    } else { // otherwise, a string was passed in or default to height
      equalize = options || 'height';
    }

    if (!$.isFunction($.fn[equalize])) { return false; }

    // determine if the height or width is being equalized
    type = (equalize.indexOf('eight') > 0) ? 'height' : 'width';

    return $containers.each(function() {
      var $children = $(this).children(),
          max = 0; // reset for each container
      if (children) { $children = $(this).find(children); }

      $children.each(function() {
        var $element = $(this),
            value;
        if (reset) { $element.css(type, ''); } // remove existing height/width dimension
        value = $element[equalize]();          // call height(), outerHeight(), etc.
        if (value > max) { max = value; }      // update max
      });

      $children.css(type, max +'px'); // add CSS to children
    });
  };

}(jQuery));

$('#list1').equalize();
$('#list2').equalize({children: 'p'});