title: How to continue to next loop iteration only after a button press in javascript?
body: <p>I have code similar to this:</p>
  
  <pre><code>for(i = 0; i &lt; array_of_questions.length; i++){
    // call function that gathers necessary data + appends question to screen
    // Now it needs to wait until the user presses a button to continue on to the next iteration. Right now it is set up like this:
  
    $("#submit_button").on('click', function() {
  
              //save data
  
          });
  }
  </code></pre>
  
  <p>My problem now is that it calls the function correctly... for all of the iterations. The on click function defines what would happen if the button was clicked but the loop continues after that. I'm always left with the last question displayed.</p>
  
  <p>What is the best approach to fix this?</p>