title: jQuery show within page fails unless alert is added (or debug)
body: <p>I am sure this is a timing issue of some sort but I can't get to the root of it.
  Some background
  We have a web app which loads and changes data via javascript (no ajax calls, all data is local to the page).
  We are working on the mobile version and of course it takes longer to render the pages so we are trying to add a "loading, please wait" image while the stuff renders behind the scenes.
  I have the div element added and it works fine on initial page load but when the user changes screens the loading div does not show up unless I either put in an alert right after the show or debug things stepping through.</p>
  
  <p>Here is part of the code</p>
  
  <pre><code>function showSpinner() {
     // if already being shown why show again
     if (!spinnerOn)
     {
        $("#loading").show();
        spinnerOn = true;
        //alert("loading div should be visible");
     }
  }
  
  function closeSpinner() {
      spinnerOn = false;
      $("#loading").hide();
  }
  </code></pre>
  
  <p>If I put that alert back in the showSpinner function div shows up, if not it doesn't.</p>
  
  <p>The function is called as part of another function (triggered by an onClick)</p>
  
  <pre><code>showSpinner();
  navObj.setCurrTabID(tabID);
  tabObj = navObj.getCurrTabObjects();
  $.each(tabObj, function (index) {
      currID = "#" + index;
      if (index == tabID) {
         $(currID).addClass("active");
         $(currID).removeClass("inactive");
      }
      else {
         $(currID).addClass("inactive");
         $(currID).removeClass("active");
      }
  });
  
  displayMainDataSection(NO_CHANGE);
  </code></pre>
  
  <p>Here is the displayMainDataSection (there is a lot of other code as well)</p>
  
  <pre><code>function displayMainDataSection(initLevel)
  {
  
      $("#notes-table").hide();
      $("#bubbleCaps").hide();
      $("#equiGraph-middle").hide();
      $("#pieSection").hide();
      $("#descBox").hide();
      $("#raceSection").hide();
      $("#horseNotesDisplay").hide();
      $("#gridDesc").empty();
      $("#horseLegend").hide();
      $("#playerChoices").hide();
      $("#graphChoices").hide();
      $("#pieButtonSetDiv").hide();
      $("#spdButtonSetDiv").hide();
      $("#statsTableReg").empty();
      $("#raceListDiv").hide();
  
      hideMessages();
      hideBigOrSmallDivs();
      resetMargins();
      if (hammer) {
          setHammer();
      }
  
  
  
      switch (navObj.currScreen) {
           case 'notes':
              // Display the NOTES data screen
              clearDataSectionDivs("");
              displayNotesScreen();
              $("#notes-table").show();
              break;
         case 'raceSummary':
              // Display the Race Summary Screen
              if (!isSmallScreen) {
                  $("#equiGraph-middle").show();
                  $("#gridDesc").html(raceListDescText);
              }
              else {
                  // remove the header bottom margin for the the race list and the horse list
                  $(".equiGraph-model").css("margin-bottom", "0px");
              }
              showRegTableDiv();
              displayRaceSumMiddleSection();
              // show the Static table ("Reg"), not one controlled by a "show grid" button
              displayTableTitleLine("Reg");
              displayTableSection(navObj.getDefaultTableID(), "Reg");
              break;
         case 'bubbleCap':
              // Display the Bubble Capper Screen
              $("#bubbleCaps").show();
              showGridTableDiv();
              displayMiddleSection();
              clearDataSectionDivs();
              displayTableTitleLine("");
              displayTableSection(navObj.getDefaultTableID(), "");
              displayBubbleGraphs(initLevel, navObj.getDefaultBubCapDisplay());
              break;
         case 'speed':
              // Display the Speed/Class Screen
              showGridTableDiv();
              displayMiddleSection();
              $("#gridDesc").html(raceGraphDescText);
              displayTableTitleLine("");
              displayTableSection(navObj.getDefaultTableID(), "");
              changeSpdClsGraphType(navObj.getDefaultSpdClsGraph());
              //showGridDialog();
              break;
         case 'playerPie':
              // Display the Player Pie Screen
              showGridTableDiv();
              displayMiddleSection();
              $("#pieSection").show();
              changePieChartSection(navObj.getDefaultGraphCol(), navObj.getDefaultGraphType());
              displayTableTitleLine("");
              displayTableSection(navObj.getDefaultTableID());
              break;
        default:  //signals
              showRegTableDiv();
              displayMiddleSection();
              // show the Static table, not one controlled by "show grid" button
              displayTableSection(navObj.getDefaultTableID(), "Reg");
              break;
      }
      return;
  }
  </code></pre>
  
  <p>It actually can be called from a couple of spots and then the end of displayMainDataSection calls the closeSpinner function to hide the div again.</p>
  
  <p>Any thoughts on why the div doesn't show up?</p>