this is not working

Question

i want to get the user name and add it to 'hello' it works with prompts but not working here
it works when I make the value of localstorage a string

<p id='txt'>some text</p>
<form onsubmit="return false">
Name:<input id='bar' type="text" placeholder="Type your name here" >
<button onclick="insert()" type="submit" id='insbtn'>insert</button>
</form>
<script>
var txt=document.getElementById('txt');
var bar =document.getElementById('bar').value;
var insbtn = document.getElementById('insbtn');
localStorage.setItem('name',bar)
function insert(){
var getlc=localStorage.getItem('name')
txt.innerHTML='hello'+getlc
}
</script>

Answer 1

Hi Youssef. It is because where you call txt, bar, insbtn, and localStorage.setItem('name',bar) where out of the function insert

Answer 2

<p id='txt'>some text</p>
<form onsubmit="return false">
   Name:<input id='bar' type="text" placeholder="Type your name here" >
<button onclick="insert()" type="submit" id='insbtn'>insert</button>
</form>
<script>

function insert(){
  var txt=document.getElementById('txt');
  var bar =document.getElementById('bar').value;
      var insbtn = document.getElementById('insbtn');
  localStorage.setItem('name',bar)
var getlc=localStorage.getItem('name')
txt.innerHTML='hello '+getlc
}
</script>

Answer 3

Thanks carmen appreciate your help
Carmen Lucía