Why does this jQuery click handler not work in Codesandbox?

Viewed 96

This very simple jQuery click handler code works here on StackOverflow, but when I paste it here to Codesandbox, it only works for button and span but not a anchor tags: https://codesandbox.io/s/debug-anchor-click-pw141

<html>
    <head>
        <meta charset="UTF-8" />
        <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

        <script>
            $(document).ready(function() {
                const elements = $('button, span, a');
                console.log('ready elements', elements);
                elements.click(function(evt) {
                    //TODO Why does this work for all element types on StackOverflow but does not work for anchor `a` elements in CodeSandbox.io?
                    console.log('removing', $(this));
                    $(this).remove();
                });
            });
        </script>
    </head>
    <body>
        <button>button1</button>
        <button>button2</button>
        <span>
            span
        </span>
        <a href="#settings">
            anchor
        </a>
    </body>
</html>

Am I doing something wrong?

0 Answers
Related