Quiero desplazarme sobre un div y usar su atributo de datos único para cambiar el src de un img en otro lugar de la página. Entonces revisa la lista y la URL cambia según el div sobre el que se cierne. Mi enfoque hasta ahora fue agregar un evento de mouseover a todos los elementos de mi lista y activar una función cada vez que obtendrá el atributo de datos del elemento actual sobre el que se pasa el mouse. Pero no funciona y tengo la sensación de que me estoy acercando a esto desde el ángulo equivocado. Soy consciente de que esto se resuelve fácilmente usando unas pocas líneas de jquery, pero me gustaría no usarlo, ya que lo necesitaría únicamente para esto. Hay una manera de hacer esto en javascript simple y antiguo, ¿verdad?

 const workThumb = document.querySelectorAll('#work-thumb'); const works = document.querySelectorAll('.work-list').forEach(item => { item.addEventListener('mouseover', event => { var src = this.getAttribute('data-thumb'); workThumb.setAttribute("src", url); }) })

 <a class="work-list" data-thumb="http://url.to/test.jpg"> <a class="work-list" data-thumb="http://url.to/test.jpg"> <a class="work-list" data-thumb="http://url.to/test.jpg"> [...]

 <img id="work-thumb" src="test.jpg">