Uncaught TypeError: Cannot set properties of null (setting 'innerHTML') Problem?

<input type="text" class="output input" />
    <button class="output button">press</button>
    <ul class="output ul"></ul>
    //   const list = document.querySelector(".output ul");

    // If I remove output class from list then 

      const list = document.querySelector(". ul");
      const searchInput = document.querySelector(".output input");
      const searchBtn = document.querySelector(".output button");
	//   Uncaught TypeError: Cannot set properties of null (setting 'innerHTML') *Problem is here, why I can't find solution*

      list.innerHTML = "";

      const myHistory = [];
      const MAX_HISTORY = 5;
	//   Uncaught TypeError: Cannot set properties of null (setting 'onclick')  Then This Problem is created What is the solution
      searchBtn.onclick = () => {
        if (searchInput.value !== "") {

          list.innerHTML = "";

          for (const itemText of myHistory) {
            const listItem = document.createElement("li");
            litItem.textContent = itemText;


it show the item every time enter in searchInput

Sir, this problem from MDN array topics (Active learning: Top 5 searches). Could you solve this problem sir?

Try this ?

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.