JavaScript - Como tomar el ID de una imagen cuando se hace clic sobre ella

<div class="muestra_color" id="muestra_color">

    <?php require_once('php/conexion.php');

    $res = $con->query("select * from colores");

    while($f = mysqli_fetch_array($res)){ ?>

        <img src="<?php echo $f['img']; ?>" alt="" id="<?php echo $f['id']; ?>" name="<?php echo $f['id']; ?>">

    <?php } ?>

</div>

<img src="1.png" alt="" id="1" data-name="imagen de una casa">

<img src="2.png" alt="" id="2" data-name="imagen de una moto">

<script>

document.querySelectorAll("img").forEach(el => el.addEventListener("click", clickImagen));

function clickImagen(e) {

    alert(this.dataset.name);

}

</script>