Tengo una clase principal de animales y múltiples subclases como leopardo, caracal y guepardo. Se colocan en la página web una vez que se hace clic en sus respectivos botones y cuando se hace clic en mi botón de inicio, todos se mueven en momentos aleatorios (milisegundos) a la derecha de la página web. ¿Cómo determinaría cuál fue el primero en llegar a la derecha de la página?

Así es como obtengo el ancho completo de la página web:

 var trackWidth = $(window).width();

La siguiente función se invoca una vez que se hace clic en el botón de inicio en la página html, cada clase infantil o animal en este caso tiene esta función

 Leopard.prototype.getReady = function() { var raceTime = Math.floor((Math.random() * 5000) + 1) this.$node.animate({ left: trackWidth,//This move the animal the width of the webpage(In this case, the track) }, raceTime) }

Esta es una matriz que almacena cada instancia de un Animal:

 var arr = window.animals = [];

Esta función itera a través de la matriz y llama a getReady de cada clase secundaria

 var start_btn = document.querySelector(".startRace"); $(start_btn).click(function() { arr.forEach(function(animal) { animal.getReady() }) })

Entonces, sí, mi pregunta es si cuatro animales estuvieran corriendo a lo ancho de la página web, ¿cómo podría imprimir cuál fue el primero o el que tiene una carrera?

(Por favor, infórmeme si la pregunta debe actualizarse o rehacerse)