He presentado datos (recetas de café) a través del servidor json en mi página (12 por página). Cuando busco un café usando la barra de búsqueda, puedo encontrar el café que está dentro de esa página, pero cuando hago clic en el siguiente botón es No puedo encontrarlo. (En resumen, solo puede encontrar el café presente actualmente en la página. ¿Cómo puedo cambiar esto? Quiero buscar cualquier café de mi base de datos.

este es mi codigo he renderizado solo 12 elementos por página

 function search_coffee() { let input = document.getElementById('searchBar').value input=input.toLowerCase(); let x = document.getElementsByClassName('coffee-card'); for (i = 0; i < x.length; i++) { if (!x[i].innerHTML.toLowerCase().includes(input)) { x[i].style.display="none"; } else { x[i].style.display="list-item"; } } } searchBar.addEventListener("keyup",search_coffee)