为何脚本无法更新页面元素内容？环境问题排查求助

我这段代码在其他环境中实现过相同功能且可正常运行，因此怀疑是环境问题。我预期该脚本能将ID为demo的元素内容更新为"hi"，相关代码如下：

HTML代码 #

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>replit</title>
  <link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
  <div id="demo">before</div>
</body>

</html>

CSS代码 #

html, body {
  height: 100%;
  width: 100%;
}

JavaScript代码 #

const box = document.getElementById("demo");
box.innerText = "hi";

内容的提问来源于stack exchange，提问作者Margaret Guzman