jquery - loop through all children of .each

[RIRedinPA]

If you have this html

 

<div id="tablebox">
	<ul>
		<li>
			<p>Field 1</p>
			<p>Field 2</p>
			<p>Field 3</p>
			<p>Field 4</p>
			<p>Field 5</p>
			<p>Field 6</p>
			<p>Field 7</p>
			<p>Field 8</p>
			<p>Field 9</p>
			<p>Field 10</p>
		</li>
	<ul>

	<ul>
		<li class="tablerow">
			<p>Field 1</p>
			<p>Field 2</p>
			<p>Field 3</p>
			<p>Field 4</p>
			<p>This is a lot of text that should throw the layout off</p>
			<p>Field 6</p>
			<p>Field 7</p>
			<p>Field 8</p>
			<p>Field 9</p>
			<p>This is a shorter amount of text</p>
		</li>
	</ul>
</div>

 

how would  I go about with jquery looping through each child of each <li> which met the argument class=tablerow?

 

i can get here but then stumble going through the children:

 

function init() { 
$(document).ready(function(){

   $('.tablerow').each(function(index) {
    	      var maxheight = 0;
              var childcount = $(this).children.length;
                 //this gives me the proper number of children, I now need to access the height of each one
    	      });
});
}

		window.onload = init;

[RIRedinPA]

I got it working to an extent:

 

This will loop through all the child elements (<p>), (kind of obvious once I thought it through) but when I try to return the height I get a funky message...

 

<script language="javascript">

		function init() { 
			$(document).ready(function(){

				$('.tablerow').each(function(index) {
    					var maxheight = 0;
    					$(this).children().each (function() { 
    						alert($(this).height);
    					})
    				});
			});
		}

		window.onload = init;

	</script>

 

and the funky message is:

 

function (f) {
    var e = this[0];
    if (!e) {
        return f == null ? null : this;
    }
    if (c.isFunction(f)) {
        return this.each(function (j) {var i = c(this);i[d](f.call(this, j, i[d]()));});
    }
    return "scrollTo" in e && e.document ? e.document.compatMode === "CSS1Compat" &&
        e.document.documentElement["client" + b] ||
        e.document.body["client" + b] : e.nodeType === 9 ? Math.max(e.documentElement["client" + b], e.body["scroll" + b], e.documentElement["scroll" + b], e.body["offset" + b], e.documentElement["offset" + b]) : f === w ? c.css(e, d) : this.css(d, typeof f === "string" ? f : f + "px");
}

[RIRedinPA]

Figured it out, change the alert to - alert($(this).css('height'));, if you're just looking for the numbers you'll have to split the "px" off the end.