Why does a new audio file start playing if one is already playing? (JS)

I don't know why, but I can't figure out why this does not work. I've been sitting for hours trying different methods, reading and watching videos on the subject, but I still can not figure it out.

Q: Why does a "new" audio file start playing, overlapping the previous one, every time I click the element? Should my if statement not take care of that?

document.getElementById("chatWrapper").addEventListener("click", playSound);

function playSound() {
    //alert("Success!");
    var sEE0 = new Audio('../sound/00-menu-music.mp3');
        sEE0.volume = 0.2;
    if (sEE0.duration > 0) {

        return;
    } else {
        sEE0.play();
    }
}

How do I solve this? Thanks in advance!