This seems silly, but I can't find how to do an asynchronous function call with jQuery that doesn't involve some server-side request. I have a slow function that iterates through a lot of DOM elements, and I want the browser to not freeze up while this function is running. I want to display a little indicator before the slow function is called, then when the slow function returns, I want to hide the indicator. I have the following:

$('form#filter', parentNode).submit(function() {

  var form = $(this);

  indicator.show();

  var textField = $('input#query', form);

  var query = jQuery.trim(textField.val());

  var re = new RegExp(query, i);

  slowFunctionCall(); // want this to happen asynchronously; all client-side

  indicator.hide();

  return false;

});

Currently I submit the form and the indicator isn't displayed, the browser freezes, and then slowFunctionCall is finished.

Edit: I used Vivin's answer, specifically the Sitepoint link to get the following solution:

var indicator = $('#tagFilter_loading', parentNode);

indicator.hide();

var spans = $('div#filterResults span', parentNode);

var textField = $('input#query', parentNode);

var timer = undefined, processor = undefined;

var i=0, limit=spans.length, busy=false;

var filterTags = function() {

  i = 0;

  if (processor) {

    clearInterval(processor);

  }

  indicator.show();

  processor = setInterval(function() {

    if (!busy) {

      busy = true;

      var query = jQuery.trim(textField.val()).toLowerCase();

      var span = $(spans[i]);

      if ('' == query) {

        span.show();

      } else {

        var tagName = span.attr('rel').toLowerCase();

        if (tagName.indexOf(query) == -1) {

          span.hide();

        }

      }

      if (++i >= limit) {

        clearInterval(processor);

        indicator.hide();

      }

      busy = false;

    }

  }, 1);

};

textField.keyup(function() {

  if (timer) {

    clearTimeout(timer);

  }

  /* Only start filtering after the user has finished typing */

  timer = setTimeout(filterTags, 2000);

});

textField.blur(filterTags);

This shows and hides the indicator and also doesn't freeze the browser. You get to watch the DOM elements being hidden as it works, which is what I was going for.