Retornando valores en la función que enviamos a each

Ahora vamos a ver un par de posibilidades interesantes al utilizar each. Resulta que la función que enviamos como parámetro a each() puede devolver valores y dependiendo de éstos, conseguir comportamientos parecidos a los conocidos break o continue de los bucles Javascript. 

Si la función devuelve "false", se consigue detener por completo el proceso de iteraciones de each(). Esto es como si hiciéramos el típico "break". Si la función devuelve "true", se consigue pasar directamente a la próxima iteración del bucle. Es como hacer el típico "continue". Para ver estos dos casos realizaremos otro ejemplo de uso de each. 

Tenemos varios DIV, donde cada uno tiene un texto.

<div>red</div>

<div>blue</div>

<div>red</div>

<div>white</div>

<div>red</div>

<div>green</div>

<div>orange</div>

<div>red</div>

<div>nada</div>

<div>red</div>

<div>blue</div>

Ahora queremos hacer un recorrido a esos DIV y en cada uno, mirar el texto que aparece. Entonces colocaremos como color del texto del DIV el color que aprece escrito en el DIV. Pero con dos casos especiales:

 • Si el texto del DIV es "white", entonces no queremos hacer nada con ese elemento. 

• Si el texto del DIV es "nada", entonces detendremos el bucle y dejaremos de colorear los siguientes elementos. Esto lo podríamos hacer con el siguiente código:

$("div").each(function(i){

elemento = $(this);

if(elemento.html() == "white")

return true;

if(elemento.html() == "nada")

return false;

elemento.css("color", elemento.html());

});

Ahora podremos ver este ejemplo en funcionamiento en una página aparte.