Mostrando y ocultando capas con text input

[suudobal]

Buenas a todos,

Estoy haciendo un listado de ingredientes con fotos en pequeñas fichas. El caso es que muestro en una página esas fichas y puede haber en algunos casos como 30 ingredientes. Mi idea entonces es poner un text input encima del todo el listado y al ir escribiendo sólo se van mostrando los ingredientes que tengan en el nombre lo escrito en el input. Sería así la organización de las capas principales de manera muy resumida:

Código HTML:

<input type="text" id="buscar">
 
<div><span>Arroz</span></div>
<div><span>Sal</span></div>
<div><span>Pimienta</span></div>
<div><span>Pollo</span></div>
<div><span>Poleo</span></div>
 

Entonces al empezar a escribir "A" se mostraría solo la capa div con todo el contenido donde el span es Arroz. Si empiezo a escribir "P" pues se mostrarían sólo los div de Pimienta, Pollo y Poleo... si sigo con "Po" pues sólo se ven los de Pollo y Poleo. No se si me explico. Pero también se mostraría sólo, por ejemplo la de pollo si escribo "llo" ya que es la única que lo contiene.

¿Conocéis algún recurso o algo parecido? ¿O alguna idea en jQuery para implementarlo?