Tengo un archivo script.js que estoy usando para crear un archivo html mediante programación. Tengo un elemento de color de entrada simple y un botón con un detector de eventos. Cuando hago clic en el botón, paso una función addElement que agrega un div y establece el color de fondo en cualquier color que elija el usuario. Por alguna razón, no puedo hacer que el div acepte el color. Nada falla y el párrafo que tengo en el div puede aceptar el color que establece el color de entrada. Entonces es un problema con div. ¿Algunas ideas?

 function addElement (color) { console.log(typeof color) const newDiv = document.createElement("div"+ String(divCounter)); newDiv.id = "div"+ String(divCounter) console.log(color) newDiv.style.backgroundColor = color newDiv.addEventListener("click",function() { deleteElement(newDiv.id)}) const text = document.createElement("P"); text.style.backgroundColor = "green" console.log(text.style.backgroundColor) var newContent; if(textBox0.value == "" || textBox1.value ==""){ newContent = document.createTextNode("Error: Missing One or More Operands"); }else{ newContent = document.createTextNode(textBox0.value + " " + arthList.value + " " + textBox1.value +" = " + eval(textBox0.value + arthList.value + textBox1.value)); } text.appendChild(newContent); newDiv.appendChild(text); calculationDivs.insertBefore(newDiv,calculationDivs.firstChild) divCounter++; } /* * Button */ const button = document.createElement("INPUT") button.setAttribute("style","height:35px; width:100px;") button.setAttribute("type","button") button.setAttribute("value","Compute") button.addEventListener("click",function(){addElement(colorChoice.value)}) titleDiv.appendChild(button) /* * Color Choice */ const colorChoice = document.createElement('INPUT') colorChoice.setAttribute("type","color") titleDiv.appendChild(colorChoice)