如何用另一个-javascript替换div元素中的同一行

在这里，我试图显示玩家在输入错误字母后留下的生命数，如下所示：

然而，当玩家第二次输入错误的字母时，它是这样的。我希望更新的生命在同一行中被替换

这是我给LiveSconter编码的地方

function livesCounter(){
    var lives = document.createElement('DIV');
    lives.innerHTML = "Lives Left:" + livecount;
    lives.id = "livesCount";
    hint.appendChild(lives);

    if(livecount<1){
        lives.innerHTML = "Game Over";
    }   
}

函数livesconter（）{
var lives=document.createElement（'DIV'）；
lives.innerHTML=“lives Left:”+livecount；
lives.id=“livescont”；
提示：追加儿童（生命）；
如果（livecount您的livesconter函数每次调用时都只是追加。它应该查看元素是否已经存在，并基于此，创建元素并追加，或者简单地更新html

var livesCountDiv = document.getElementById("livesCount")
if (livesCountDiv != null){
   livesCountDiv.innerHTML = "Lives Left:" + livecount;
} else {
   var lives = document.createElement('DIV');
   lives.innerHTML = "Lives Left:" + livecount;
   lives.id = "livesCount";
   hint.appendChild(lives);
}

函数livesconter（）{
$（“#liveScont”）.remove（）；
var lives=document.createElement（'DIV'）；
lives.innerHTML=“lives Left:”+livecount；
lives.id=“livescont”；
提示：追加儿童（生命）；
如果（livecount将
LiveSconter
功能更改为：


var-livecount=9；
var hint=document.getElementById（“main”）；
livesconter（livecount）；
函数livesconter（livecount）{
var a=document.getElementById（“LiveScont”）；
如果（a）
{
a、 innerHTML=“生活左边：”+livecount；
}
其他的
{
var lives=document.createElement（'DIV'）；
lives.innerHTML=“lives Left:”+livecount；
lives.id=“livescont”；
提示：追加儿童（生命）；
如果（livecount
document.getElementById（“liveScont”）.innerHTML=livecount
假设元素存在。@PrashantPimpaleyes发布了一个答案！那么Prashant的评论会起作用。（我会使用
.textContent
），而不是
innerHTML
）。仍然没有结果。我可以调用LiveSconter（）的位置吗函数和它有什么关系吗？试过了，但没有结果。
//THE HANGMAN GAME 
var words = ['quaffle', 'bludger', 'pensieve', 'harry', 'lupin', 'butterbeer', 'polyjuice', 'patronus', 'horcrux', 'voldemort'];
var hints = ['A ball used in the wizarding game of quidditch thrown into one of the three goal hoops.', 'A ball bewitched to knock quiddich players of their brooms', 'A shallow metal basin used to review stored memories.', 'The boy who lived', 'The werewolf professor', 'A popular wizarding beverage',
    'A potion that allows the drinker to assume the form of someone else', 'A complicated and powerful defensive charm', 'An object used to attain immortality',
    'He Who Must Not Be Named'
];
correctletters = '';
missedletters = '';
livecount = 10;
counter = 0;



function getRandomWord() {
    randomWord = words[Math.floor(Math.random() * words.length)];
    wordlength = randomWord.length;
    showHint();
    livesCounter();
}



function drawDashes() {
    elem = document.getElementById('lettercontainer');
    for (var i = 0; i < wordlength; i++) {
        var letterdash = document.createElement('DIV');
        letterdash.classList = 'dash';
        elem.appendChild(letterdash);
    }
}


function getGuess() {
    if (event.keyCode == 13) {
        letterGuessed = document.getElementById("inputfield").value.toLowerCase();
        document.getElementById("inputfield").value = null;
        alert(randomWord);
        r = randomWord.includes(letterGuessed);
        alert(r);

        if (r == true) {
            correctletters = correctletters + letterGuessed;
            alert("correct letters: " + correctletters);
        } else {
            missedletters = missedletters + letterGuessed;
            alert("missed letters: " + missedletters);
        }
        guess = missedletters + correctletters;

        replaceBlanks()
        displayGuessedLetters();
    }
}

function replaceBlanks() {
    for (var j = 0; j < wordlength; j++) {
        if (randomWord[j] === letterGuessed) {
            div = elem.getElementsByTagName("DIV")[j].innerHTML = letterGuessed;
            counter+=1;
            alert(counter);
        }

        else{
            livecount-=1;
        }

    }
}

function showHint() {
    hint = document.getElementById("hintcontainer");
    var wordIndex = words.indexOf(randomWord);
    hint.innerHTML = hints[wordIndex];
}

function livesCounter(){
    var lives = document.createElement('DIV');
    lives.innerHTML = "Lives Left:" + livecount;
    lives.id = "livesCount";
    hint.appendChild(lives);

    if(livecount<1){
        lives.innerHTML = "Game Over";
    }   
}


function displayGuessedLetters() {
    var content = document.createTextNode(letterGuessed);
    var container = document.getElementById("guessedletters");
    container.appendChild(content);
    guessedletters.style.cssText = 'font-family: "Josefin Sans"; font-size: 30px; text-transform: uppercase; color: rgb(255, 85, 49); letter-spacing: 20px';
}

<body>
<div id = inputcontainer>
    enter a letter from <font color="orangered">A</font> to <font color="orangered">Z</font>:
    <form onsubmit="return false">
        <input maxlength = 1 id = inputfield onkeydown = "getGuess()" type="text">
    </form>

    guessed letters: <div id = guessedletters></div>

</div>

<div id = lettercontainer></div>

<div id = hintcontainer>
    <div id = livesCount></div>
</div>


<script>getRandomWord(); drawDashes(); replaceBlanks(); checkLetter()</script>
</body>

var livesCountDiv = document.getElementById("livesCount")
if (livesCountDiv != null){
   livesCountDiv.innerHTML = "Lives Left:" + livecount;
} else {
   var lives = document.createElement('DIV');
   lives.innerHTML = "Lives Left:" + livecount;
   lives.id = "livesCount";
   hint.appendChild(lives);
}

function livesCounter() {

$("#livesCount").remove();
var lives = document.createElement('DIV');
lives.innerHTML = "Lives Left:" + livecount;
lives.id = "livesCount";
hint.appendChild(lives);

if(livecount<1){
    lives.innerHTML = "Game Over";
   }   
}