[Dúvida] Não estou conseguindo implementar a mudança das cores no JS

HTML

        <section class="selecaoDeCores">
            <div class="container">
                <ul class="listaDeCores box">
                    <li class="cores" data-coresBtn><img data-cores src="img/Robotron 2000 - Amarelo.png"></li>
                    <li class="cores" data-coresBtn><img data-cores src="img/Robotron 2000 - Branco.png"></li>
                    <li class="cores" data-coresBtn><img data-cores src="img/Robotron 2000 - Azul.png"></li>
                    <li class="cores" data-coresBtn><img data-cores src="img/Robotron 2000 - Rosa.png"></li>
                    <li class="cores" data-coresBtn><img data-cores src="img/Robotron 2000 - Vermelho.png"></li>
                    <li class="cores" data-coresBtn><img data-cores src="img/Robotron 2000 - Preto.png"></li>
                </ul>
            </div>
        </section>

JavaScrpt

const robotron = document.querySelector("[data-robotron]");
const botaoCores = document.querySelectorAll("[data-coresBtn]");
const cores = document.querySelectorAll("[data-cores]");

botaoCores.forEach( (cor) => 
{
    cor.addEventListener("click", (evento) => 
    {
        robotron.src = evento.target.src;
    })
})