Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I use jquery to get the height of a dynamically created child element with no Id

I have a div that dynamically get's loaded with two images always and possibly one div in between. Neither the images or the div have id's associated with them (and I can't make them have Id's). Inspecting them with firebug they are just shown as <IMG> and <DIV>. I need to get the height of this child div when it exists.

I was hoping I could do something like this...

$("#parentDiv > DIV").height();

or this...

$("#parentDiv > DIV")[0].height();

Since jquery $ returns an array. The second one gives javascript errors so I know I'm off there. I think these should be close though. Any ideas?

Edit: Here is the html I am running against.

<DIV id="parentDiv" name="parentDiv">
    <IMG style="DISPLAY: block; VERTICAL-ALIGN: bottom; CURSOR: pointer" height="17" src="..." />

    <!-- this div may or may not be here -->
    <DIV style="DISPLAY: block; BACKGROUND-IMAGE: url(...); WIDTH: 16px; CURSOR: pointer; BACKGROUND-REPEAT: repeat-y; POSITION: relative; HEIGHT: 144px; outline: none">
        <DIV style="LEFT: 0px; OVERFLOW: hidden; WIDTH: 16px; POSITION: absolute; TOP: 128px; HEIGHT: 8px">
             <IMG style="LEFT: 0px; POSITION: absolute; TOP: 0px" height="8" src="..." />
        </DIV>
    </DIV>

    <IMG style="DISPLAY: block; VERTICAL-ALIGN: bottom; CURSOR: pointer" height="17" src="..." />
</DIV>
like image 912
Carter Avatar asked Mar 10 '09 19:03

Carter


2 Answers

to get an indexed jQuery element, use the eq() function:

$("#parentDiv > DIV").eq(0).height();

or

$($("#parentDiv > DIV")[0]).height();

or

$("#parentDiv > DIV:eq(0)").height();
like image 53
cobbal Avatar answered Nov 15 '22 10:11

cobbal


Just to add to all the other ways of doing it:

$("#parentDiv > div:first").height();
like image 23
Marius Avatar answered Nov 15 '22 08:11

Marius