Preventing double click. Should the CSS or javascript method be used here?

[asasass]

Inside Chrome when I tap on the SVG a few times, the bottom text becomes highlighted.

It doesn’t do it in firefox though.

Below are 2 methods that work, which of the two ways of doing it should I use?

Edit fiddle - JSFiddle - Code Playground

CSS Method:

Edit fiddle - JSFiddle - Code Playground

  <div class="noSel">
</div>

.noSel {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

---

Javascript Method
https://jsfiddle.net/xeqtcp5k/113/

    document.getElementById("button").addEventListener("mousedown", function(evt) {
        if (evt.detail > 1) {
            evt.preventDefault();
        }
    }, false);

Full Code:

(function iife() {
    "use strict";
    const player = document.getElementById("player");
    const button = document.getElementById("button");
    const value = document.getElementById("input");
    const sent = document.getElementById("sent");

    function playPauseIcon(play) {
        if (play) {
            button.classList.add("is-playing");
        } else {
            button.classList.remove("is-playing");
        }
    }
    button.addEventListener("click", function() {
        if (player.paused) {
            player.play();
            playPauseIcon(true);
        } else {
            player.pause();
            playPauseIcon(false);
        }
    });
    document.getElementById("button").addEventListener("mousedown", function(evt) {
        if (evt.detail > 1) {
            evt.preventDefault();
        }
    }, false);
    sent.addEventListener("click", function() {
        player.src = value.value;
        player.volume = 1.0;
        playPauseIcon(true);
    });
}());

---

[asasass]

I think javascript is the better method here.

What does everyone else think?

Javascript Method
https://jsfiddle.net/xeqtcp5k/113/

    document.getElementById("button").addEventListener("mousedown", function(evt) {
        if (evt.detail > 1) {
            evt.preventDefault();
        }
    }, false);

[TechnoBear]

Why do you need to prevent the text being selected? Doing anything which interferes with the expected functioning of the browser / system is likely to confuse and annoy visitors to your page.