Почему отображается только одна кнопка, когда должно быть две?

<button class="open-button" onclick="openForm()">Регистрация</button>
<button class="open-button" onclick="openForm()">вход</button>
 
<link rel="stylesheet" href="css/okno.css">
 
<div class="form-popup" id="myForm">
  <form action="#" class="form-container">
    <h1>Регистрация</h1>
    <label for="name"><b>Имя</b></label>
    <input type="text" placeholder="Ваше имя" name="name" required>
    <label for="email"><b>Е-мейл</b></label>
    <input type="text" placeholder="Ваш е-мейл" name="email" required>
<label for="password"><b>Пароль</b></label>
    <input type="text" placeholder="Ваш пароль" name="Password" required>
    <button type="submit" class="btn">Отправить</button>
    <button type="button" class="btn cancel" onclick="closeForm()">Закрыть</button>
  </form>
</div>
 
<link rel="stylesheet" href="css/vhod.css">
<div class="form-popup" id="vhodform">
  <form action="#" class="form-container">
    <h1>Вход</h1>
    <label for="email"><b>Е-мейл</b></label>
    <input type="text" placeholder="Ваш е-мейл" name="email" required>
<label for="password"><b>Пароль</b></label>
    <input type="text" placeholder="Ваш пароль" name="Password" required>
    <button type="submit" class="btn">Отправить</button>
    <button type="button" class="btn cancel" onclick="closeForm()">Закрыть</button>
  </form>
</div>
 
<script>
function openForm() {
    document.getElementById("myForm").style.display = "block"; }
function closeForm() {
    document.getElementById("myForm").style.display = "none";
} </script>
 
<script>
function openForm() {
    document.getElementById("vhodform").style.display = "block"; }
function closeForm() {
    document.getElementById("vhodform").style.display = "none";
} </script>