O código a seguir é capaz de realizar a seguinte tarefa : ao clicar no botão "Criar Quadrado" um quadrado vermelho é renderizado na tela em cada clique. Desejo que ao passar o mouse por cima destes quadrados gerados estes troquem de cor. Segue o código : <html> <head> <meta charset="UFT-8" /> <title></title> </head> <body> <div id="container"></div> <button type="button" onclick="criarQuadrado()">Criar quadrado</button> <script> function criarQuadrado() { var boxElement = document.createElement("div"); boxElement.style.width = 300; boxElement.style.height = 300; boxElement.style.display = "inline-block"; boxElement.style.backgroundColor = "#f00"; var container = document.getElementById("container"); container.appendChild(boxElement); } </script> </body> </html> A função quer será responsável por gerar as mudanças de cores é a seguinte : function getRandomColor() { var letters = "0123456789ABCDEF"; var color = "#"; for (var i = 0; i < 6; i++) { color += letters[Math.floor(Math.random() * 16)]; } return color; } var newColor = getRandomColor(); Como posso resolver tal problema?