Question

I have searched all day and can´t find an answer to my problem.

I have the folowing DIV setup:

<div id="MainDiv1">
    <div id="Galery1">
        <div id="Image" style="width:100px;"></div>
        <div id="Image" style="width:100px;"></div>
        <div id="Image" style="width:100px;"></div>
    </div>
</div>
<div id="MainDiv2">
    <div id="Galery2">
        <div id="Image" style="width:80px;"></div>
        <div id="Image" style="width:80px;"></div>
        <div id="Image" style="width:80px;"></div>
    </div>
</div>

What I need is, with Javascript, to set a variable with the Width of any of the “Image” DIV, but only the ones in the “Galery1”.
Since they all have the same width any of them will work.

I have tryed:

DIVwidth = document.getElementById("Image");

But this always gives me back 80px, that are from the “Galery2” DIV.
I assume I have to give a Path somehow to limit the search into the “Galery1” or “MainDiv1” DIVs.

I can not give unique names to the DIVs.

Any suggestions?

Answer 1

IDs should be unique. I.E. you should not have more than one id="Image"

To select the first div in Gallery2 try this:

document.getElementById( 'Gallery2' ).getElementsByTagName( 'div' )[0]; // <-- '0' gets first item from array