Tampermonkey to select a dropdown value. It has no ID or name, just a class?

Question

I\'m writing a Tampermonkey code for a webpage like ConverTo:
It\'s supposed to automatically select the second option in a dropdown:

Answer 1

See Choosing and activating the right controls on an AJAX-driven site.
Many AJAX-driven controls cannot just be changed; they also must receive key events, for the page to set the desired state.

In the ConverTo case, that select appears to expect^‡ :

1. A click event.
2. A value change.
3. A change event.

You would send that sequence with code like this complete, working script:

// ==UserScript==
// @name     _ConverTo, Automatically select mp4
// @match    https://www.converto.io/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==
//- The @grant directive is needed to restore the proper sandbox.

waitForKeyElements (".format-select:has(option[value=mp4])", selectFinickyDropdown);

function selectFinickyDropdown (jNode) {
    var evt = new Event ("click");
    jNode[0].dispatchEvent (evt);

    jNode.val('mp4');

    evt = new Event ("change");
    jNode[0].dispatchEvent (evt);
}

---

^‡ There are other state sequences possible, to the same end.