在调用函数之前更新inner.html

Question

如果用户输入的值小于5，我希望inner.html更新，并再次提示用户。该代码本身具有功能，但是我希望它执行一次inner.html更新并再次提示用户，而不是仅在不更改inner.html的情况下进行提示。

编辑：我不认为这是重复的，另一个问题询问何时以及如何进行回流操作。但这并不能解决我遇到的问题，即在出现提示之前先更新inner.html，除非我错过了某些事情。

players = []
function numberOfPlayers() {
    playerCount = prompt("Please enter number of players. A minimum of 5 players is required.", "5");
    if (playerCount === null) {
      return;
    }
    if (parseInt(playerCount) >= 5) {
        document.getElementById("intro").innerHTML =
          "There are " + playerCount + " players."; 
        namesOfPlayers(playerCount);
        } else {
      document.getElementById("intro").innerHTML =
        "Invalid. A minimum of 5 players is required. Hit the button to try again." 

          numberOfPlayers(); //I want it to update the text before calling numberOfPlayers() again 
//the prompt pops up without the text changing.
          }
    } 
function namesOfPlayers(playerCount) {
    for (i = 1; i <= playerCount; i++) {

        var playerName = prompt("Enter name of player " + i, "John Doe")
        players.push(playerName)
        }
      document.getElementById("names").innerHTML =
        "The players are " + players.toString();
    }



</script>

<p id="intro">Click the button to begin the game.</p>

<button onclick="numberOfPlayers()">Begin</button>

<p id="names"></p>