Dropdown example is non-functional

[DianaProbst]

Issue in /src/pages/uxp/reference-spectrum/User Interface/sp-dropdown.md

[DianaProbst]

`document.querySelector(".yourDropdown").addEventListener("change", evt => {

console.log(`Selected item: ${evt.target.selectedIndex}`);

})`

is given as an examples, but ".yourDropdown" is not defined anywhere in the details above, and no matter how I add IDs, or look for classes, I just can't find out where it should go. No matter what I do, I'm getting Uncaught TypeError: Cannot read properties of null (reading 'addEventListener') as an error.

As an aside, there's no indication of how a querySelector should work, which may be a valid choice, but as someone new to this means I have a whole lot of extra tabs to open, and an inline link to what a querySelector is and does would be great. That's not the main issue, though.

[DianaProbst]

(This took me about half an hour to comb through, until I found the correct inheritance and combo of selectors. That could be cleared up.)

[JimaDobes]

Thanks @DianaProbst this is super helpful. We will (at some point) try to get this resolved and appreciate your debugging. There's a bit of conflation between the template we draw from and our repo which we'll try to sort out before resolving this.