prototype selector equivalent to jQuery

Question

Hi!

How can I select the popupwindow of the popup-lightbox div?

in jQuery, it's be something like $('div#popup-lightbox #popupwindow'). Unfortunatly, in Prototype, it's not that easy... anyone can help me? thanks!

<div id="popup-lightbox" class="popup">
    <div id="popupoverlay"></div>
    <div id="popupdiv">
        <div id="popupwindow"></div>
    </div>
</div>

<div id="popup-modal" class="popup">
    <div id="popupoverlay"></div>
    <div id="modaldiv">
        <div id="popupwindow">
            <div id="modalint">Your changes have not been saved.</div>
        </div>
    </div>
</div>

Answer 1

First up, you're using ID attributes incorrectly. According to the W3C specification, ID attributes are supposed to be unique across the document.

That aside, the prototype selection syntax is slightly different from jQuery:

$("popup-lightbox").select("#popupwindow")[0];

Answer 2

Actually since id should be uniq at the page I'm not sure that it makes sense to use complex selector. Why not just $('popupwindow')?

Answer 3

Use the bling-bling http://api.prototypejs.org/language/dollardollar/

$$('#popup_lightbox #popup_window') (also, you are not using ids properly, like desau and fantactuka said)