append value to element with javascript (not jquery)

Question

<script>
var cool = "cool";
var pass = document.getElementById('name');
pass.innerHTML = cool;
</script>
<small id="name"></small>

To be honest I am just not searching correctly; this seems very basic. I have been using jquery for everything, but never actually used much JS by itself, so I am wondering how one would append a value to an element using just JS.

• Netwidz: What you have done is correct... What is your exact question?

Answer 1

Your code should work, but you need to add it after the element is defined, otherwise document.getElementById('name') will return null as name element doesn't exist yet.

<small id="name"></small>
<script>
var cool = "cool";
var pass = document.getElementById('name');
pass.innerHTML = cool;
</script>

Answer 2

Your code should work... you have to define the JS after

<small id="name"></small>

If not there might be a problem which try to search DOM element before it loads

• Netwidz: yes.. what is wrong in the answer?? is that means answer is wrong?

Answer 3

Basically you executing the javascript before creating the html

<small id="name"></small>

so the javascript does not work on the non-existent html .