PHP takes only the first value in a loop

I have a problem that when I clicked the button which is a list, it only displays the first value which is ‘The Grass is Always Greener’ even if I clicked different book title.

<form method="POST" action="test.php">
                            <?php
                                echo '<ul class="grid-container">';
                                while ($row = mysqli_fetch_assoc($result)) {
                            ?>
                                <button><li>
                                    <?php echo '<img src="img/'.$row['cover'].'">'?>
                                    <p><?php echo $row['title']?></p>
                                    <p><?php echo $row['author']?></p>
                                    <input type="hidden" name="titleOfBook" value="<?php echo $row['title']?>"> 
                                </li></button>

                            <?php
                                }
                                echo '</ul>';
                            ?>
                        </form>

This is my test.php, just only for displaying the value

<?php
    require 'database/connect.php';

    $clicked = $_POST['titleOfBook'];

    echo '<h1>' . $clicked . '</h1>';
?>

I’ve tried several steps like changing the position of input througout the loop but it really doesn’t work.

This is the UI,

and this is the produced HTML when I clicked a book: