setAttribute "value" returns undefined

June 28, 2022

I am dynamically (but not async) building html elements with js and encounter an error upon setting the "value" attribute.
Simplified code:

 let tag = document.createElement("div");
      tag.innerHTML = `${item}`;
      tag.setAttribute("value", `${item}`); 
      tag.classList.add("newtags", "lot of css classes")
      tagslist.appendChild(tag)


    newtags = Array.from(document.querySelectorAll('.newtags'))
    newtags.forEach(item => {
       item.addEventListener("click", e =>{
        console.log(e.target.value)
    })
  })

Upon clicking on the created tags I get "undefined" yet if I do console.log(e.target) without adding value I can see it is working and the value is there. Am I setting something that isn’t really the value of the element?
Thanks

>Solution :

div element doesn’t have value property. only few elements such as input, textarea have value
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes