I need help creating a hamburger menu in javascript. What's the most efficient way to create this without using jquery? The javascript code that I have at the bottom should work but I'm missing something else. 

```
<html>
    <head>
        <style>
            .hamburger {
                position: relative;
                display: inline-block;
                width: 1.25em;
                height: 0.75em;
                border-top: 0.18em solid #000;
                border-bottom: 0.18em solid #000;
            }

            .hamburger:before {
                content: "";
                position: absolute;
                top: 0.3em;
                left: 0px;
                width: 100%;
                border-top: 0.18em solid #000;
            }

        </style>
    </head>
    <body>
        <span class="hamburger"></span>
        <li>Development</li>
        <li>Illustrations</li>
        <script type="text/javascript">
            var myEl = document.getElementById('hamburger');
            myEl.addEventListener('click', function() {
                this.classList.toggle('activated');
            }, false);
        </script>
    </body>
</html>

```