Test case details

Preparation Code

<div id="content">     <div class="menu">         50 items         <ul>             <li>Not initialized</li>         </ul>     </div> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script>     function repeat(str, number) {         return new Array(number + 1).join(str);     } </script>
// Create 50 items     $('ul').html(repeat('<li>Foobar</li>', 50));

Test cases

Test #1

var items = $('ul > li'),     randomizedItems = $.makeArray(items).sort(function () {         return 0.5 - Math.random();     }),     step = 2 ;     (function () {     if (!randomizedItems.length) {         return;     }         var applyTo = randomizedItems.splice(0, step);         var argumentsCallee = arguments.callee;         $(applyTo).animate({         opacity: 0.25     }, 500);                 $(applyTo).last().queue(function(next) {         $(this).dequeue();             argumentsCallee();     }); })();

Test #2

var items = $('ul > li'),     randomizedItems = $.makeArray(items).sort(function () {         return 0.5 - Math.random();     }),     step = 2 ;     (function () {     var applyTo = randomizedItems.splice(0, step);         var argumentsCallee = arguments.callee;         $(applyTo).animate({         opacity: 0.25     }, 500);                 $(applyTo).last().queue(function(next) {         $(this).dequeue();             argumentsCallee();     }); })();

Test #3

var items = $('ul > li'),     randomizedItems = $.makeArray(items).sort(function () {         return 0.5 - Math.random();     }),     step = 2 ;     function myFunc () {     var applyTo = randomizedItems.splice(0, step);         $(applyTo).animate({         opacity: 0.25     }, 500);                 $(applyTo).last().queue(function(next) {         $(this).dequeue();             myFunc();     }); }    myFunc();

Test #4

var step = 2; function f(elt){     elt.addClass('away').animate({         opacity: 0.25     }, 500);     } function lf(){    var eltList = $('ul>li:not(.away)'); if( eltList.length > 0){     var elt = [];         for (var i = 1; i <= step; i++) {         elt.push(eltList.eq( Math.random() * eltList .length).get(0));     }     f($(elt));     setTimeout(lf,500); }     } lf();

Test #5

var items = $('ul > li'),     randomizedItems = $.makeArray(items),     step = 2 ;     (function () {     if (!randomizedItems.length) {         return;     }         var applyTo = randomizedItems.splice(0, step);         var argumentsCallee = arguments.callee;         $(applyTo).animate({         opacity: 0.25     }, 500);                 $(applyTo).last().queue(function(next) {         $(this).dequeue();             argumentsCallee();     }); })();

Test #6

var items = $('ul').find('li'),     randomizedItems = $.makeArray(items).sort(function () {         return 0.5 - Math.random();     }),     step = 2 ;     (function () {     if (!randomizedItems.length) {         return;     }         var applyTo = randomizedItems.splice(0, step);         var argumentsCallee = arguments.callee;         $(applyTo).animate({         opacity: 0.25     }, 500);                 $(applyTo).last().queue(function(next) {         $(this).dequeue();             argumentsCallee();     }); })();