How do i get rid of the not defined/undefined message in my JS console

Question

I got my Javascript to talk to my API gateway and my counter keeps going up however on my console it says "undefined", I am not sure how to resolve this issue. I am not sure what has changed in my code but not i am getting a different message saying instead of the usual "undefined".

fetch('https://wwrr7r0kj5.execute-api.eu-west-2.amazonaws.com/dev/')
   .then(response => response.text())
   .then(contents =>{
        console.log(contents);
        document.getElementById("visitors").innerHTML = contents
})

 Promise {<pending>}
 VM126:4
 296

---

 <script>
    fetch('aws api')
    .then(response => response.text())
    .then(contents => console.log(contents))
     document.getElementById("visitors").innerhtml = content
 </script>

---

<div>
    <p  style="text-align: center;color: white;"> 
    Visitors: <span id="visitors">0</span> 
    </p>
</div>

Answer 1

Here:

<script>
    fetch('aws api')
    .then(response => response.text())
    .then(contents => console.log(contents))
     document.getElementById("visitors").innerHTML = content
 </script>

content is not defined, you probably meant contents , but you have to do it after the promise is resolved:

<script>
    fetch('aws api')
    .then(response => response.text())
    .then(contents =>{
        console.log(contents);
        document.getElementById("visitors").innerhtml = contents
    })
 </script>