Build a Real Time Counter - Build a Real Time Counter

Tell us what’s happening:

I’m trying to figure this out but can’t get the text content of charCount to display.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Real Time Counter</title>
    <link href ="styles.css" type="stylesheet">
</head>

<body>
    <textarea id="text-input" placeholder="type something"></textarea>
    <p id="char-count">Character Count: 0/50</p>

    <script src="../script.js"></script>
</body>


</html>
/* file: styles.css */
.red{color: red};
/* file: script.js */
    const text = document.getElementById("text-input");
    const charCount = document.getElementById("char-count");

function updateCharacterCount(){
  const textInputValue = text.value;
  const count = textInputValue.length;
  if(count >= 50){
      textInputValue = substring(0,50);
    }
    const updatedCount = textInputValue.length;
charCount.textContent = `Character Count: {$updatedCount/50}`;
if(updatedCount >= 50){
  charCount.classList.add("red");
}else{
  charCount.classList.remove("red");
}
}


    

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.5 Safari/605.1.15

Challenge Information:

Build a Real Time Counter - Build a Real Time Counter
https://www.freecodecamp.org/learn/full-stack-developer/lab-real-time-counter/build-a-real-time-counter

don’t go up one folder, the script file is at the same level of the html file

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.