jQuery Forum

I have a script that works nicely but sometimes takes several seconds to run. (It has to iterate through every line of a table, so it runs long if the table has a lot of contents.)

I'm ok with the wait, but I'd like to provide some feedback to the user so they know it's working. The normal throbber/startAjax functions only work on ajax calls; this isn't an Ajax call, so it's not detected by those methods. It's just a JS process that takes a few seconds to run. I thought I could just do something like this:

$('#button').click(function () {  // when the user clicks the button
  $('#throbber').show();             // start the throbber before iterating thru the table
  $('table tr').each(function() {
      // do some stuff
  });
  $('#throbber').hide();                // hide throbber after iterating thru table
}); // end onClick

Unfortunately, this doesn't work. If I leave the throbber.hide() method off, the throbber starts displaying *after* the whole click(function()) runs its course. If I add the .hide() method back in, then the throbber never shows up at all.

So: Is there a way to say this? :
1. Show the throbber before you start iterating
2. Do the iteration
3. Hide throbber when done

You can see my live code at : http://www6b.wittenberg.edu/lib/public/non-ajax-throbber.php
(the functionality of the page is: click some of the table contents to select those entries, then click the button at the top of the page to limit to those entries. that click is where it takes a while)

Any help would be much appreciated! Thanks.