Javascript, GetElementById element is not defined?-CodePudding

For some reasons, I can't display #coupon with javascript, when i try to get elementById it displays the error message elementById undefined,

HTML

<html>

<head>
  <title>Exercise</title>
  <link rel="stylesheet" href="stylesheet.css">
  <script src="javascript.js"></script>
</head>

<body>

  <div class="inputi">
    <p class="input-text">Une Jam?</p> <input placeholder="Sheno emrin..." type="text" id="inputId">

    //checks input value
    <button type="button" onclick="getInputValue()">Vazhdo</button>
    // shows error message if it doesn't match the array
  <p id="message"></p>
  </div>


    // i want to display this with javascript, after the login
    <h1 id="coupon">You won giftcard </strong></h1>
    <button id="coupon">abas</button>

 


</body>

</html>

JS ( the problem )

** the problem getElementById is undefined, I want to display:block after the successful login attempt. **

      var zzz = getElementById("coupon")
      if(zzz === "none") {
      display:block; }
 

    
      
      // document.writeln("<h1>Keni fituar kupon 50% ne <strong> Green & Protein </strong> </h1>");
      
      // document.writeln('<input class="giftcode" placeholder="'  finalcode '" type="text" id="inputId">');
      display_image(images[z], 400, 400, 'Javascript');
      document.write('<br>'   user[i]);

    }
  }

}

CodePudding user response：

Call document.getElementById instead. Docs - https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById

CodePudding user response：

Two things:

getElementById should be document.getElementById
you need to move your script tag to the bottom of the body tag to ensure that the element is in the DOM when you select it

Use:

<html>
   <head>
      <title>Exercise</title>
      <link rel="stylesheet" href="stylesheet.css">
   </head>
   <body>
      <div class="inputi">
         <p class="input-text">Une Jam?</p>
         <input placeholder="Sheno emrin..." type="text" id="inputId">
         //checks input value
         <button type="button" onclick="getInputValue()">Vazhdo</button>
         // shows error message if it doesn't match the array
         <p id="message"></p>
      </div>
      // i want to display this with javascript, after the login
      <h1 id="coupon">You won giftcard </strong></h1>
      <button id="coupon">abas</button>
      <script src="javascript.js"></script>
   </body>
</html>