如何为我上传的所有图像制作模态弹出按钮？

Question

我想为我的所有图像制作一个弹出式模式按钮，但只有第一个有效，我知道我必须添加一些foreach代码，但我不知道如何。

<div id="myModal" class="modal">

    <span class="close">&times;</span>

    <img class="modal-content" id="img01">

</div>

<div class="gallery">

    <div class="containerPhotos">

        <?php

            require_once 'classes/dbh.php';

            if (isset($_GET['entry_id'])) {

                $entry_id = $_GET['entry_id'];

                $query = mysqli_query($conn, "SELECT * FROM images WHERE entry_id='$entry_id'");

                if ($query->num_rows > 0) {

                    while ($row = $query->fetch_assoc()) {

                        $dirname = 'uploads/' . $row["file_name"];

                        echo '<img class="photo" onclick="showImage(this)" id="myImg" src="' . $dirname . '" />';

                    }

                }

            }

        ?>

    </div>

</div>

    <script>

        var modal = document.getElementById('myModal');

        var img = document.getElementById('myImg');

        var modalImg = document.getElementById("img01");

        img.onclick = function () {

            modal.style.display = "block";

            modalImg.src = this.src;

        }

        var span = document.getElementsByClassName("close")[0];

        // When the user clicks on <span> (x), close the modal

        span.onclick = function () {

            modal.style.display = "none";

        }

    </script>

我希望使用foreach代码为所有人工作，但我不知道如何。