Use jQuery to fire the click event on all a Div's Submit buttons
<p>I have a form with multiple submit buttons. This bit of jQuery code runs before the form is transmitted:</p>

<pre><code>$(":submit").click(function () {
        $("input[name='social']").val($(this).prevAll(".social").html());
        $("input[name='footer']").val($(this).prevAll(".footer").text());
});
</code></pre>

<p>So one form, multiple buttons that, when clicked initialize the form's values to carry values found inside the given DIV (those elements that are sibling to the given submit button).</p>

<p>That much works - clicking the buttons indivdually. Now I'd like to implement a 'Click All' button that fires each of the submit buttons in turn. Here's the logic i'm pursuring:</p>

<pre><code>    $("#submitAll").click(function () {
        $("#allPerDay input:submit").each(function () {
            //$(this).trigger('click');
            alert("hit " + this.value);
        });
    });
</code></pre>

<p>As is, that code will alert all the submit buttons, but when I try to add the .trigger function, only the first button fires. I suspect it's a matter of scope - while the form is correctly populated and submitted (abet just once), other aspects of response handling are hosed.</p>

<p>Is there an approach that would create a pause until some sort of success response is heard? </p>

<p>FOLLOWUP:
The structure is:</p>

<pre><code>&lt;form ....&gt;
    &lt;div id=sibling1&gt;
        &lt;div class=social&gt;values to insert to form&lt;/div&gt;
        &lt;div class=footer&gt;other values to insert&lt;/div&gt;
        &lt;input type="submit" value="Name of First Group" /&gt;
    &lt;/div&gt;
        &lt;div id=sibling2&gt;
        &lt;div class=social&gt;another set of values to insert to form&lt;/div&gt;
        &lt;div class=footer&gt;another set of other values to insert&lt;/div&gt;
        &lt;input type="submit" value="Name of 2nd Group" /&gt;
    &lt;/div&gt;
&lt;/form&gt;
</code></pre>

<p>And perhaps more importantly, I'm using this code to handle the server's reply. That means this is an AJAX-submitted form. To repeat, the original form (user clicks each DIV's submit button) works and honors the 'success' handler. Now that I'm trying to 'Submit All', the form submits (just once) but the AJAX handling is never run.</p>

<pre><code>    var options = {
        target: '#output'   
    , success: showResponse  
    };

    $('#frmPerDay').ajaxForm(options);
</code></pre>
