This is a classic problem with pages that change their content via AJAX.
@run-at
has no effect because the targeted content is loaded long after the window load
event. And, "new" pages are really complete rewrites via AJAX -- until you refresh the page, at least.
Change the script to @run-at document-end
(or omit the line) and then, depending on the target page and how you are using it, it may be enough to fire off of hashchange
as shown on "I have to refresh the page for my Greasemonkey script to run?" or as shown on this other answer.
The go to tool is waitForKeyElements
More info, however. Your script might be as simple as:
// ==UserScript==
// @name _YOUR_SCRIPT_NAME
// @include http://YOUR_SERVER.COM/YOUR_PATH/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require https://gist.github.com/raw/2625891/waitForKeyElements.js
// ==/UserScript==
waitForKeyElements ("[name='skuAndSize']", setSizeIndex);
waitForKeyElements (".button-container.add-to-cart", clickAddToCart);
function setSizeIndex (jNode) {
var node = jNode[0];
for (var J = node.options.length - 1; J >= 0; --J) {
if (node.options[J].text == "11") {
node.selectedIndex = J;
break;
}
}
}
function clickAddToCart (jNode) {
var clickEvent = document.createEvent ('MouseEvents');
clickEvent.initEvent ('click', true, true);
jNode[0].dispatchEvent (clickEvent);
}
See, also, "Choosing and activating the right controls on an AJAX-driven site".