HTML/Javascript scope
css, html, javascript
Solution
You can't have non-unique IDs. You can use the `class` property though. Change `id="inner"` to `class="inner"` and if you're using JQuery, you could try using child selectors. For example:
$("#a > .inner");
Without jQuery
document.getElementById('a').getElementsByClassName('inner')[0];
Problem
I have been fiddling around with HTML lately and I have a question. Is there a way to scope element's id as a child of another element? It's difficult to describe, but here's an example. ``` <body> <div id="a"> <div id="inner"></div> </div> <div id="b"> <div id="inner"></div> </div> </body> ``` I do not know if this is legal (since "inner" is declared twice), but the problem is as follows: Suppose I have a webpage full of square divs with their own styles and fixed positioning (kinda like Windows 8 metro), I would like to be able to group all components of a particular square into that square, so that I can use javascript to focus on the elements in the scope of say, in pseudocode. ``` ClickMeButtonDiv.ClickMeButton.value = parseInt(ClickMeButton.value) + 1; ``` In short, I want to know if it is possible to group all children of a div to that div, because if I have 100 squares on one page doing their own thing, it is a headache to keep all elements by id bound to global scope... Is there any way to accomplish this? Thanks ahead of time!