<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <script>
            window.addEventListener("DOMContentLoaded", function() {
                var playlist = document.getElementById("playlist");
                playlist.addEventListener("change", function(e) {
                    var song = new Audio(e.target.value);
                    song.addEventListener("load", function(z) {
                        z.target.play();
                    }, false);
                }, false);
                var add = document.getElementById("add");
                add.addEventListener("change", function(e) {
                    playlist.options[playlist.options.length] = new Option(e.target.value, e.target.value);
                    playlist.size = playlist.options.length + 1;
                }, false);
                
            }, false);
        </script>
    </head>
    <body>
        
        <p>Select a file in the playlist to play it<br><select id="playlist"></select></p>
        <p>Add a .wav file to the playlist: <input id="add" type="file" value="test"></p>
    </body>
</html>