Hello Aaron, Thanks for sharing your thoughts about the progressive enhancement article I wrote.

HTML is full of things that are only become useful when another layer is placed on top of it: a section element only gets its meaning when an algorithm recognises it and does stuff with, and are probably harmless if not. Classnames only become useful when a stylesheet applies stuff to them, and are harmless otherwise. The handler functions in my article work the same: they only get meaning when JS runs and does stuff with the function names. And, I would say, they are harmless otherwise (and not invasive :-))

The difference between your overlay method and mine, is that you, in JS, query for elements (‘.overlay’), then run the overlay function on them, whereas I let the HTML element “tell” the JS a function needs to run on it. So the knowledge of what functions run on what is stored in mark-up instead of script (just like knowledge of what appearance should apply to what is stored in classes in the mark-up instead of the stylesheet). Also, my method uses one click handler instead of many.

In my method, separation and mark-up are separated in the sense that JS is applied as a layer on top of the mark-up, which would work just fine without it. I agree with you that this is an important principle.