e.PreventDefault() not working when text is clicked

Question

So, I am trying to create a music playlist on my website. I have where the music plays when I click the different text. However, I want it to do where it will not take me to a page for the song to play. I have tried to use a e.PrevetnDefault() for this to work, hoping that it would cancel my page opening a new page when the text is clicked on. However, it is not working. Whenever I click on the texts, a page opens.

A look at my code:

   <script>
    audioPlayer();

    function audioPlayer() {
        var currentSong = 0;
        $("audioPlayer")[0].src = $("DJList li a")[0];
        $("audioPlayer")[0].play();
        $("DJList li a").click(function(e) {
            e.preventDefault();
            $("#audioPlayer")[0].src = this;
            $("audioPlayer")[0].play();
            $("#DJList li a").removeClass("current-song");
            currentSong = $(this).parent().index();
            $(this).parent.addClass("current-song");
        });

        $("audioPlayer")[0].addEventListener("ended", function() {
            currentSong++
            if (currentSong == $("DJList li a").length)
                currentSong = 0;
            $("DJList li").removeClass("current-song");
            $("DJList li:eq(" + currentSong + ")").addClass("current-song");
            $("audioPlayer")[0].src = $("DJList li a")[currentSong].href;
            $("audioPlayer")[0].play();
        });
</script>

Answer 1

$("DJList li a").click(function(e) { won't select your link since DJList isn't any element name that'll get selected. Hence your preventDefault isn't even getting called.
Changing it to $("#DJList li a") might do for starters. You have the same mistake at multiple places.