tags:

views:

31

answers:

0

Hi,

Just playing around with jqtouch. I have a ajax callback that gets regions froma DB. while waiting I want it to display a 'loading' message which has been knocked up in css. Works perfectly except it keeps appeneding to the end of the page when i try and remove the class from the loading message.

$('#Regions').bind('pageAnimationEnd', function(e, info){
                if (!$(this).data('loaded')) {                      // Make sure the data hasn't already been loaded (we'll set 'loaded' to true a couple lines further down)
                    $(this).append($('<div class="progress">Loading...</div>').         // Append a placeholder in case the remote HTML takes its sweet time making it back                      
                      load('ajax.php #info', function() {        // Overwrite the "Loading" placeholder text with the remote HTML
                            $(this).removeClass('progress');
                            $(this).append().data('loaded', true);  // Set the 'loaded' var to true so we know not to re-load the HTML next time the #callback div animation ends
                        }));
                }
            });

If I remove the $(this).removeClass('progress'); it works fine but then the page has the css applied to progress.