JavaScript Getelementbyid() Not Working

JavaScript getElementByID() not working

At the point you are calling your function, the rest of the page has not rendered and so the element is not in existence at that point. Try calling your function on window.onload maybe. Something like this:

<html>
<head>
    <title></title>
    <script type="text/javascript">
        window.onload = function(){
           var refButton = document.getElementById("btnButton");

            refButton.onclick = function() {
                alert('I am clicked!');
            }
        };
    </script>
</head>
<body>
    <form id="form1">
    <div>
        <input id="btnButton" type="button" value="Click me"/>
    </div>
    </form>
</body>
</html>

document.getElementById not working / Display

There are two mistakes here,

You need to surround id with " (Double Quotes)
You should put script tag after the dom element is created, else it may execute before the actual dom is created. Even if you keep js code in a separate file, make sure you write it after your dom, just before the body tag ends.

So your code should be like,

<p id="pointsdisplay"></p> 
<script>
    var points = 1000;
    document.getElementById('pointsdisplay').innerHTML = "Points:" + points;
</script>

Working jsFiddle

document.getElementById() not working

You are mixing javascript with JQuery.

If you want to use javascript then it will be

var xd = document.getElementById('xdialog');

and not

var xd = document.getElementById('#xdialog');

If you want to use Jquery,then use like this:-

var xd = $("#xdialog");

getElementById not working in class method

Setting innerHTML on #text replaces the contents of the <p> entirely, so when you subsequently try to access #reference it no longer exists.

The simplest way to avoid this would be to add another span and replace its text instead of the entire <p>.

<div id='verse'>
  <p>
    <span id='reference'>random stuff here</span> 
    <span id='text'>random stuff here</span>
  </p>
</div>

document.getElementById not behaving as expected

A <template>'s children don't get rendered - they aren't really on the page. As MDN says:

Think of a template as a content fragment that is being stored for subsequent use in the document. While the parser does process the contents of the <template> element while loading the page, it does so only to ensure that those contents are valid; the element's contents are not rendered, however.

It doesn't have children in the DOM.

console.log(document.querySelector('template').children.length);

<template>
  <p>foo</p>
</template>

function and getElementById not working in Javascript

You're just taking the ID reference and doing nothing with it. I think what you want to do is in this answer: https://stackoverflow.com/a/271172/2938055

Javascript getElementbyId.value not returning any value

Change this

 var pTotal = parseInt(document.getElementById('precioSinEnv').value);

To this

 var pTotal = parseInt(document.getElementById('precioSinEnv').textContent);

JavaScript Getelementbyid() Not Working