('#button_search').on('click', function(){
var buscador = $('#buscador').val().toLowerCase();
$('.producto span').each(function(){
var name_products = $(this).text().toLowerCase();
if(name_products.indexOf(buscador) !== -1){
$(this).parents('.producto').show();
$('#text').hide();
} else {
$(this).parents('.producto').hide();
$('#text').show();
}
});
});
body{
display: flex;
}
.section_one{
width: 30%;
background: #cdcdcd;
}
.section_two{
width: 70%;
background: #ededed;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.producto{
width: 25%;
text-align: center;
background: #cdcdcd;
display: block;
}
.producto img{
width: 100%;
}
#text{
font-size: 2vw;
padding: 25%;
display: none;
}
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<aside class="section_one">
<input type="text" id="buscador" placeholder="Buscar moto..." maxlength="36">
<button id="button_search">Buscar</button>
</aside>
<aside class="section_two">
<div class="producto"><img src="https://www.formulamoto.es/elementosWeb/gestionCajas/FOM/Image/2018//kawasaki-ninja-H2R.jpg"><span>Moto Rfa 2000</span></div>
<div class="producto"><img src="https://www.formulamoto.es/elementosWeb/gestionCajas/FOM/Image/2018//kawasaki-ZX-10RR_g.jpg"><span>Sudora KFI</span></div>
<div class="producto"><img src="https://as.com/betech/imagenes/2017/10/13/portada/1507918164_397427_1507918224_noticia_normal.jpg"><span>Z-moto 6000 turbo</span></div>
<div class="producto"><img src="https://www.crmotos.com/motocicletas/formula/bajacilindrada/sport/sportx200/fotos/1M.jpg"><span>Hirasc 300k</span></div>
<div class="producto"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcTt-wqMoSBYFaR6dIJE9a02yMmQJl6AUYrYnQ&usqp=CAU"><span>Az Mini-Inferno 10000</span></div>
<div class="producto"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSAk-Q8UCYkf4YBLwh6QZr1yx-gB8mbn0Hh9Q&usqp=CAU"><span>Droma T legacy</span></div>
<div class="producto"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRcHyCIrQoZjVqudofBdi_qh9wGiRJfdpbZxw&usqp=CAU"><span>KazaQ Op</span></div>
<div class="producto"><img src="https://www.crmotos.com/motocicletas/formula/bajacilindrada/sport/sportx200/fotos/1M.jpg"><span>Marine T-5000</span></div>
<p id="text">No se encontraron resultados...</p>
</aside>
Hola a todos, tengo este buscador interno simple que busca diferentes productos, en este caso motos, tengo un problema que cuando el valor del input type="text" no es igual al nombre de alguna moto o letra que lleve esta, me muestre la etiqueta p con id text. He intentado agregando una funcion show y hide para las condicionales dentro del each pero cuando se muestra una moto, se muestra el texto de no encontrado. ¿Cómo hago para que el texto se muestre sólo cuando la búsqueda no coincide con ningún nombre ni letra de la moto?