Replace spaces with dashes in an HTML class or id using javascript

Question

I am trying to replace the spaces of the innerHTML of an element by the following code:

<script type="text/javascript">
    var minsFix = document.getElementById("spaceX").innerHTML;
    var keepVal = minsFix.replace(/\s+/g, "-");
    document.getElementById("spaceX").innerHTML = keepVal;
</script>

But it only changes the first space to a dash(-) and other spaces are not changed respectively.

Resolved I manage to create my solved code. here

<script type="text/javascript">
    // create variable for collect Class : spaceX
    var keepVal = document.getElementsByClassName("spaceX");
    // loop for collect SpaceX
    for (var i = 0; i < keepVal.length; i++) {
        // turn spaceX collected to Text
        var tranText = keepVal[i].innerText;
        // create variable for replace spaceX to -
        var toSpace = tranText.replaceAll(/\s+/g, '-');
        // output to html one by one
        document.getElementsByClassName('spaceX')[i].innerHTML = toSpace;
    }
</script>

hope can help someone