Как исправить поиск слов , что бы поиск искал в тегах pre

у меня есть такой код


<input type="text" id="myInput" onkeyup="myFunction()" placeholder="быстрый поиск">

 function myFunction() {
   
   var input  = document.getElementById('myInput'),
       filter = input.value.toUpperCase(),
       li     = document.querySelectorAll("li");
   
       for (i = 0; i < li.length; i++) {
           if (li[i].innerHTML.toUpperCase().indexOf(filter) > -1) {
               li[i].style.display = "";
           } else {
               li[i].style.display = "none";
           }
       }
   }

Этот код позволяет находить определённые слова , но только те , которые находятся в тегах li , а мне нужно что бы поиск был среди слов которые находятся в тегах pre , я новичёк и вообще не понимаю как это сделать , по какой то причине простая замена li на pre в этом коде не помогла и код перестал работать , возможно нужно что то добавить что бы начало работать , подскажите пожалуйста


Ответы (1 шт):

Автор решения: UModeL

простая замена li на pre в этом коде не помогла

На мой взгляд, очень даже помогла:

function myFunction() {

  var input = document.getElementById('myInput'),
    filter = input.value.toUpperCase(),
    li = document.querySelectorAll("pre");

  for (i = 0; i < li.length; i++) {
    if (li[i].innerHTML.toUpperCase().indexOf(filter) > -1) {
      li[i].style.display = "";
    } else {
      li[i].style.display = "none";
    }
  }
}
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="быстрый поиск">

<pre>я новичёк</pre>
<pre>и вообще</pre>
<pre>не понимаю</pre>
<pre>как это</pre>
<pre>сделать</pre>

→ Ссылка