title: jQuery Refresh/Reload Page After Success
body: <p>have a style switcher bar across the top of my theme. It works for the most part, but you have to hit F5 or Refresh to see the new style. How do I finish this jQuery to auto-refresh upon a successful execution? </p>
  
  <pre><code>    jQuery.fn.styleSwitcher = function(){
      $(this).click(function(){
          loadStyleSheet(this);
          return false;
      });
      function loadStyleSheet(obj) {
          $('body').append('&lt;div id="overlay" /&gt;');
          $('body').css({height:'100%'});
          $('#overlay')
              .css({
                  display: 'none',
                  position: 'absolute',
                  top:0,
                  left: 0,
                  width: '100%',
                  height: '100%',
                  zIndex: 1000,
                  background: 'black url(http://mytheme.com/loading.gif) no-repeat center'
              })
              .fadeIn(500,function(){
                  $.get( obj.href+'&amp;js',function(data){
                      $('#stylesheet').attr('href','css/' + data + '.css');
                      cssDummy.check(function(){
                          $('#overlay').fadeOut(500,function(){
                              $(this).remove();
                          }); 
                      });
                  });
              });
      }
      var cssDummy = {
          init: function(){
              $('&lt;div id="dummy-element" style="display:none" /&gt;').appendTo('body');
          },
          check: function(callback) {
              if ($('#dummy-element').width()==2) callback();
              else setTimeout(function(){cssDummy.check(callback)}, 200);
          }
      }
      cssDummy.init();
  }
  $.ajax({
    success:function(){
         $('#overlay').load('http://mytheme.com');
    }
   });
  </code></pre>