get the highest div from main div jquery

Question

I've seen this and this as well, but I just can't get them to work.

I have a main div with many children with different ids and classes inside it. I need to find a way the get the heights of a certain class and set the next divs' heights according to them. I know it's not working but it may help you understand what I would like to achieve:

var placesHeight = 0;
$('.places').each(function(){
    if(height > 35 ) {
    $(this).next('.nextdiv').css('height','(placesHeight+25)+"px"');
});

EDIT: Thanks for the quick help everyone. I tried all of it and realized all I need is this:

var placesHeight = $('.places').height();
$('.nextdiv').css('height', placesHeight+25);

score 1 · Answer 1 · answered Sep 16 '11 at 18:02

1

var placesHeight = 0;
$('.places').each(function(){
    if($(this).height() > 35 ) {
    $(this).next('.nextdiv').css('height',$(this).height()+25+"px");
});

something like that?

answered Sep 16 '11 at 18:02

Joseph Marikle

76,418
17
112
129

score 1 · Answer 2 · answered Sep 16 '11 at 18:03

1

Try this instead

$(this).next('.nextdiv').height(placesHeight+25);

answered Sep 16 '11 at 18:03

aziz punjani

25,586
9
47
56

score 1 · Answer 3 · answered Sep 16 '11 at 18:04

It would be helpful to see more of your markup - a jsfiddle would be best. Something like this might work though:

$('.places').each(function(){
    var $this = $(this),
        height = $(this).height();
    height > 35 && $this.next().height(height);
});

score 1 · Accepted Answer · answered Sep 16 '11 at 18:05

1

Here's your problem:

.css('height','(placesHeight+25)+"px"');

The value of placesHeight won't be parsed - it's going to try to set the value of the height as (placesHeight+25)+"px". It can be done more simply:

.css('height', placesHeight+25);

The "px" will be added automatically for you.

answered Sep 16 '11 at 18:05

Surreal Dreams

26,055
3
46
61

why not just use `.height('yourheight')` instead ? – aziz punjani Sep 16 '11 at 18:06
I tried to mimic the code and fix the "broken" bit - I honestly couldn't follow the intent of the code. My hope is that a simple fix of the syntax problem allows @elbatron to find the semantic solution needed. – Surreal Dreams Sep 16 '11 at 18:08

derp · Answer 5 · 2011-09-16T19:10:42.040

I hope this helps somehow,

<script type="text/javascript" src="jquery-1.6.3.min.js"></script>
<script>
function test(){
    $("#my_div").children('.check_me').each(function(){
        alert( $(this).outerHeight());
    });
}
</script>
<style>
#my_div div{
    display:block;
    margin:5px;
    border:1pt solid #ccc;
}
</style>
<button onclick='test()'>try me</button>

<div id='my_div'>
    <div id='one_line' class='check_me'>
        first
    </div>
    <div id='two_lines'>
        first<br>second
    </div>
    <div id='three lines' class='check_me'>
        first<br>second<br>third
    </div>
<div>

get the highest div from main div jquery

5 Answers5