How to set value on page load using javascript?

Question

I have to set dynamically text value when page was load. The code is..

$(document).ready(function() {
    //Function call
    setname();
});

function setname() {
  document.getElementById('loginname').value = localStorage.getItem("username");
}

<span class="text-muted text-xs block" id="loginname"></span> 

I get value from my local session but why they are not set on my loginname field? I don't know why, please help me.

Answer 1

span elements do not have a value property - you need to set innerText:

function setname() {
    document.getElementById('loginname').innerText = localStorage.getItem("username");
}

Alternatively, you can use jQuery exclusively:

$(function() {
    $('#loginname').text(localStorage.getItem('username'));
});