Create a Bookmarklet that clicks multiple buttons on one page

Question

I created a bookmarklet for a site a while back that ticks multiple checkboxes on a page:

javascript:javascript:;$("input[name='unfollow[]']").attr({checked:true});

Unfortunately the UI has changed and instead of checkboxes there are buttons that need to be clicked. Here is an example of the HTML of one of the buttons:

<button class="process mode-basic Unfollow" data-verb="unfollow">Unfollow</button>

There can be up to 100 of these buttons. How do I create a bookmarklet that clicks all of these buttons? Is it possible to build up a delay between each click?

Thanks.

Answer 1

Assuming the page has jQuery loaded, you can click each one with a delay in between:

(function(){
    var unfollowButtons = $('button.Unfollow');
    var index = unfollowButtons.length-1;
    unfollow();

    function unfollow(){
        if(index >= 0){
            $(unfollowButtons[index--]).click();
            setTimeout(unfollow, 500);
        }
    }
})();

Answer 2

$('button[data-verb="unfollow"]').on({
    click: function() {
        $('#result').append($(this).text() + ' was clicked<br/>');
    }
});

$('#unfollow-all').on({
    click: function() {
        $('button[data-verb="unfollow"]').each(function(index) {
            var el = $(this);
            setTimeout(function() {
                clickButton(el);
            }, 500 * index);
        });
    }
});

function clickButton(button) {
    button.click();
}

fiddle: http://jsfiddle.net/6AJNc/1/