title: Script executes before progress-bar starts
body: <p>I have an issue where my progress-bar starts after the rest of the code completes. Now I know whats wrong, but i cant sort of find a way to do the next step. </p>
  
  <p>I realize that whats happening is asynchronous and I need to use a promise. Can you look at my code and give some hints why?</p>
  
  <pre><code>    var count=1;
      var SIZE =100
      function test() {
          if (count &lt; SIZE) {
              var value = Math.round((count / SIZE) * 100);
              count++;
              setTimeout(function () {
                  $('.progress-bar').css('width', value + '%').attr('aria-valuenow', value);
                  test();
              }, 100);
          }
          return;
      };
  
      test().then($('body').css('background-color', '#76870b'));
  </code></pre>
  
  <p>I would like the test() to run, then have the other code execute. </p>