Since all selects have the same OPTIONs, what about creating the selects with none options, then dynamically add them when needed? At least, the HTML code will be significantlly smaller, i think it will be also lighter to the browser.
Try something like this:
<html>
<head>
<script>
function showOptions(origin) {
// do your stuff here
}
</script>
</head>
<body>
<select size="1" name="1stItem" onClick="showOptions(this);">
</select>
<select size="1" name="2ndItem" onClick="showOptions(this);">
</select>
...
</body>
</html>
Then, add or remove your SELECT's OPTIONS like this: https://stackoverflow.com/a/5422051/2333537
But when creating your code to "showOptions" function, remember to work with the origin reference, so you will be updating the SELECT object that made the call for the function, and no other else.
Good luck!