The JavaScript is not working in the webpage

Question

But_1 is working , but its not performing the function.

its giving an error cannot set property of null in the browser console. I have tried to check the javascript by console.log('script is working') in the function add(), and its not doing anything

<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="index.css">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let Count_el = document.getElementById('c1')
let count = 0
function add(){
count +=1
Count_el.innerHTML = count
}
</script>
<h1 id='heading'>Count</h1>
<h2 id="c1">0</h2>
<button id="but_1" onclick="add()">Increment</button>
<br>
<button id="but_2" onclick="">Save</button>
<br>
<p id="data">Previous Entries: </p>
</body>
</html>

score 0 · Accepted Answer · answered Jan 14 '23 at 16:40

Write javascript code after your html.

<!DOCTYPE html>
  <html lang="en">
  <head>
    <link rel="stylesheet" href="index.css">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial- 
   scale=1.0">
    <title>Document</title>
  </head>
  <body>
    <h1 id='heading'>Count</h1>
    <h2 id="c1">0</h2>
    <button id="but_1" onclick="add()">Increment</button>
    <br>
    <button id="but_2" onclick="">Save</button>
    <br> 
    <p id="data">Previous Entries: </p>
    </body>
    <script>
      let Count_el = document.getElementById('c1')
      let count = 0
      function add(){
        count +=1
        Count_el.innerHTML = count
      }
  </script>
</html>

The JavaScript is not working in the webpage

But_1 is working , but its not performing the function.

1 Answers1