Как выполнить действие над созданными элементами <li>, используя vanilla Javascript и манипулирование DOM?

Question

Я пытаюсь создать простое приложение, которое использует API-интерфейс TMDB (База данных Mov ie) для поиска любого конкретного телешоу и возврата результатов эпизодов данного шоу с рейтингом от высшего до самого низкого рейтинга.

Пока я могу использовать API для получения результатов моего поиска. Затем я добавляю 5 лучших результатов во вновь созданный элемент списка.

Мой вопрос таков: теперь, когда у меня есть результаты в текстовом виде, как мне сделать их динамическими c, чтобы я мог щелкнуть по каждому созданному и привести его к реальной странице серии?

Вот мой код:

const searchButton = document.getElementById("search-btn");
const textInput = document.getElementById("text-input");
const apiKey = "xxxxxxxxxxxxxxxx";
const newHeading = document.createElement('h1');
const p = document.createElement('p');

//search function
async function search() {
  const response = await fetch(`https://api.themoviedb.org/3/search/tv?api_key=${apiKey}&language=en-US&page=1&query=${textInput.value}`);
  const data = response.json();
  data.then(function (result) {
    console.log(result);

    //print first 5 results of search to DOM
    for (let i = 0; i < 5; i++) {
      var node = document.createElement("LI"); // create li
      var textnode = document.createTextNode(`${result.results[i].name} (${result.results[i].first_air_date.slice(0, 4)})`); // create text
      node.appendChild(textnode); // append text to li
      document.getElementById("list").appendChild(node); // append li to list
    }
  })
}
searchButton.addEventListener('click', search);

Полагаю, я просто не очень уверен, где отсюда go или если мой подход к этому в корне неверен. Любая помощь будет оценена!