How to trigger click event on all buttons with a specific class in jquery

Question

I would like to know how to trigger click event on all download buttons in jquery.

I am using WebShare from Share it and i would like to download a folder at a time because it contains many files and I can't go on downloading each file.

I tried using Downthemall but they are buttons and not links. When they are clicked the Download gets started.

Anyway, all the download buttons have the class button-download

and I tried the following

var reversed = $("button.button-download").get().reverse();

$(reversed).each(function () {
    $(this).trigger("click").delay(100);
});

But that downloads only the first file. I have tried delay() so that for every download, there will be a delay so that Firefox won't get stuck. But still, it downloads only the first one and leaves the rest (ie doesn't click on the rest of the buttons)

I am executing the script in Inspector console of firefox.

PS I have looked at available answers at Stackoverflow but they didn't seem to work for me.

Answer 1

delay only affects animation operations.

If you want to trigger click on each of them in sequence , with a delay in-between, you can use setTimeout :

$("button.button-download").each(function(i) {
    var btn = $(this);
    setTimeout(btn.trigger.bind(btn, "click"), i * 100);
});

That queues a bunch of timers, one every 100ms, and calls trigger("click") on each button as the timers fire.

Whether that will actually cause the downloads the way you want is another question, but that will successfully click the buttons.

Example without downloading, and with a longer delay so you can see it running more easily:

 $("button.button-download").click(function() { console.log(this.innerHTML + " clicked"); }); $("button.button-download").each(function(i) { var btn = $(this); setTimeout(btn.trigger.bind(btn, "click"), i * 500); }); 

 <button class="button-download">one</button> <button class="button-download">two</button> <button class="button-download">three</button> <button class="button-download">four</button> <button class="button-download">five</button> <button class="button-download">six</button> <button class="button-download">seven</button> <button class="button-download">eight</button> <button class="button-download">nine</button> <button class="button-download">ten</button> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Answer 2

Try this:

$('.button-download').each(function(i, obj) {
    obj.trigger("click");
});