Learning dojo: Chaining animations on a collection of objects <p>I'm doing some basic exercises with dojo to learn its syntax and methods. </p> <p>I've created a simplified example below for the purpose of learning chaining animations on a group of items.</p> <p>Could anyone offer some feedback on the dojo code I have created? Am I utilising the correct library features in this circumstance? Which of the dojo options do you think is the best solution for this use case?</p> <p>For reference, in jQuery I would accomplish this with:</p> <pre><code>$(function() { // jQuery $('div').fadeOut().fadeIn(); }) </code></pre> <p>For the dojo solution, I've come up with four solutions that rely on the presence of different dojo components:</p> <pre><code>// dojo dojo.require("dojo.fx"); dojo.require("dojo.NodeList-fx"); dojo.addOnLoad(function() { // Option 1: Using dojo.js only dojo.forEach(dojo.query('div'), function(div) { dojo.fadeOut({ node: div, 'onEnd': function() { dojo.fadeIn({ node: div }).play(); } }).play() }); // Option 2: Using dojo.js and dojo.fx dojo.forEach(dojo.query('div'), function(div) { dojo.fx.chain([dojo.fadeOut({node: div}), dojo.fadeIn({node: div})]).play(); }); // Option 3: Using dojo.js, dojo.fx and dojo.NodeList-fx var divs = dojo.query("div"); divs.fadeOut({ 'onEnd': function() { divs.fadeIn().play(); } }).play() // Option 4: Using base, dojo.fx and dojo.NodeList-fx var divs = dojo.query('div'); dojo.fx.chain([divs.fadeOut(), divs.fadeIn()]).play(); }); </code></pre>