Mazen Mazen - 1 year ago 79
jQuery Question

Dynamically set table cells children div heights to 100% its row height

I am trying to "dynamically" update the height of each

to be equal to its row parent

I have this very simple code that does the job good but throughout all rows. So what I am finallygetting is setting all
td divs
with the greatest value within the whole table, which I don't want.

What I want is, to set all divs with the greatest height within the same row

Any suggestions?

function setdivHeights() {
var maxHeight = -1;
$('tbody tr td div:last-child').each(function() {
if ($(this).height() > maxHeight) {
maxHeight = $(this).height();
$('tbody td div:last-child').height(maxHeight);
$('tbody td div:last-child').addClass('cell');

and this is a simplified sample of my

<table class="tablesorter" id="list">

Answer Source

Just do it per row instead of for all rows in your selector:

function setdivHeights() {
    trs = $('tbody tr');
        var maxHeight = -1;
        $(this).find('td div:last-child').each(function() {
            if ($(this).height() > maxHeight) {
                maxHeight = $(this).height();
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download