JSFiddle - React, Tailwind, and code Playground
HTML
<div>Procurar:
<input id="busca" type="text" />
</div>
<div id="texto">
<div>- A língua das Mariposas</div>
<div>- A última tempestade</div>
<div>- Agonia e Êxtase</div>
<div>- Arquitetura da destruição</div>
</div>
CSS
.marcador {
color: red;
}
JavaScript
function marcador(letras, el) {
el.innerHTML = el.innerText;
var rgxp = new RegExp(letras, 'g');
var span = '<span class="marcador">' + letras + '</span>';
el.innerHTML = el.innerHTML.replace(rgxp, span);
}
var input = document.getElementById('busca');
var texto = document.getElementById('texto');
var divs = texto.children;
input.onkeyup = function () {
for (var i = 0; i < divs.length; i++){
marcador(this.value, divs[i]);
}
}