How could I have a button display innerHTM text once it's clicked

How could I make a button to respond by displaying the content inside saved in local storage



//store value once entered
 localStorage.setItem('store', JSON.stringify(ids1.value);
 let local = localStorage.getItem('store');

let button = document.getElementsByClassName('button');
let newd = document.getElementsByClassName('newd');


let parog = document.createElement('p');
parog.innerHTML = local;
parog.style.display = 'none';

if(local !== null){ 

    button.addEventListener('click', () => { 
        newd[0].appendChild(parog.style.display = 'block');
       
    })
}

What I get is addEventListener is not a function. Any idea on how to get ti display id the condition is met

>Solution :

getElementsByClassName returns a list of elements.

Either do:

button[0].addEventListener('click', () => { 
  newd[0].appendChild(parog.style.display = 'block');
})

or

let button = document.querySelector('.button');

(This is assuming your buttons have the class button. If you’re trying to query for all button elements, use document.getElementsByName("button") or document.querySelector("button"))

Leave a Reply