How to have array on click stay at index[0]

I am trying to make an array onclick go down an index. However, every time I get to 0, it goes to the highest indexed element. I tried to make "X" item go down, but it doesn't seem to work.

The go down mean as an [0, 1, 2, "X", 4], when clicked the new array would look like [0, 1, "X", 3, 4]. However, when "X" is at index 0 i.e ["X", 1, 2, 3, 4] the item's position of the array should not change upon clicking

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

// array
let player1gameboard2 = ["X", 1, 2, 3, 4, 5, 6]

function changePositionPlayer1Down(player1gameboard2) {
  // prints out array
  console.log(player1gameboard2)

  document.getElementById("player1_test").innerHTML = player1gameboard2

  // condition if array is less than 1. Normally goes to highest index. should just stay at lowest index
  if (player1gameboard2.indexOf("X") === 0) {
    player1gameboard2.splice(
      //future index of element
      0,
      // original element
      0,

      // how to get original element
      // [0] means it is an array
      // means 1 element
      player1gameboard2.splice(0, 1)[0]
    )
    // prints out new array
    document.getElementById("player1_test").innerHTML = player1gameboard2
  }
}

<!-- language: lang-html -->

<!-- Array printed out on screen -->
<p id="player1_test"></p>

<!-- every time button clicked, indexed array goes down one space -->
<button onclick="changePositionPlayer1Down(player1gameboard2)">Go Down</button>

<!-- end snippet -->

The issue almost comes from if(player1gameboard2.indexOf("X") === 0), due to your requirement, it should be if(player1gameboard2.indexOf("X") !== 0)

Second, it's on the updated index of elements. The index of move element "X" will change on every update, not just 0.

const moveElement = "X";
let player1gameboard2 = [0, 1, 2, moveElement, 4, 5, 6]
function changePositionPlayer1Down(arr) {
    console.log(arr)

    const fromIndex = arr.indexOf(moveElement);
    
    if (fromIndex === 0) {
        return;
    }

    // replace "X" at fromIndex - 1
    arr.splice(
        fromIndex - 1,
        0,
        // cut ["X"] out of array and get "X"
        arr.splice(fromIndex, 1)[0] // same and could replace as "X"
    )
    // update value of the number has been shifted
    arr[fromIndex]++;
    document.getElementById("player1_test").innerHTML = player1gameboard2
}