Как я могу добавить выпадающий список в моей форме для раз, а также AM / PM?

Question

Я пытаюсь сделать так, чтобы поле "Время" в моей форме выбиралось раз в течение дня. Мне не нравится "input type = time" или "datetime-local", я бы предпочел раскрывающийся список.

Есть предложения?

Вот моя форма для справки:

<h1>Create a New Gig</h1>

<form action="/gigs" method="post">

  <label for="bands">Artist(s):</label>
  <input type="textarea" name="bands" id="bands" required/>
<br>
  <label for="location">Venue:</label>
  <input type="text" name="location" id="location" required/>
<br>
  <label for="date">Date:</label>
  <input type="date" data-date-format="DD MM YYYY" name="date" id="date" required/>
<br>
  <label for="time">Time:</label>
  <input type="text" name="time" id="time" required/>
<br>
  <input type="reset" value="Reset">
  <input type="submit" value="Submit">
</form>
<br>
<br>
<a href="/gigs">Back to All Gigs</a>