Agreeing with Kev and elaborating, you are misusing Codepen. For example, in the HTML, the only stuff in that HTML pane should be the stuff inside the
body tags (without the
body tags). Everything else is handled by codepen or you can add in the settings. This is different than how you do an HTML file when building locally or deploying, but this is the codepen sandbox. But that’s not what’s killing your code - if you leave this, it will still work.
Similarly (and as Kev pointed out) your main problem is those
script tags from your JS (lines 1 and 9), that will take care of that.
You will also need to load jQuery. In the “real” world you’d do that with a
When I do all that, your code works for me.