I am making a small script, which, when run in the console on Vocabulary.com, picks one answer (the third or fourth) and clicks. Then the code checks if the answer was wrong or right and goes to the next question. Because the animations between the time the question is answered and the appearance of a "next question" button is very long, I had to use a weird mix of functions and setTimeout(). Although the code works, I feel like it is messy and maybe won't always work. How could I make this code perform better and make sure it is easy to edit?

To run the script, go on https://www.vocabulary.com and run this code in the console.

function clickNextButton() {
    for (v = 0; v < 4; v++) {

    function finalClick() {
        var foo = document.getElementById("blurbPane").getElementsByTagName("button")[0];

    setTimeout(finalClick, 1000);


var myElem = document.getElementsByClassName('source')[0];
if (myElem == null){
    console.log("no source")
} else{

var mathRandom = Math.floor(Math.random() * 2 + 2);
var selectChoices = document.getElementById("questionContainer").getElementsByClassName("choices")[0].getElementsByTagName("a")[mathRandom];
setTimeout(partA, 1000);

function partA() {
    var ifMessage = document.getElementsByClassName("messagePane")[0].getElementsByTagName("h3")[0];    
    var myColor = window.getComputedStyle(ifMessage).getPropertyValue("color");
    if (myColor == "rgb(204, 0, 0)") {
    } else if (myColor == "rgb(83, 144, 7)") {

You can skip animations from elements using JQuery stop. This method is appled to a Jquery selector, and it will stop the animation running on it.

So using it, you can force to finish all the animations related to the question container after firing the click


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.