0xD34F

При таком подходе ваш код занимает 100% времени, а среда выполнения - однопоточная.

Вместо цикла используйте setInterval или setTimeout:

var i = 0;
setInterval(function() {
  document.writeln(i++);
}, 666);

function xxx(i) {
  document.writeln(i);
  setTimeout(xxx, 666, i + 1);
}
xxx(0);

function* cyclicSequence(items) {
  for (var i = 0; ; i = (i + 1) % items.length) {
    yield items[i];
  }
}

var color = cyclicSequence([ 'green', 'red', 'blue', 'yellow' ]);

$('#typeProject').click(function() {
  $('.typeProject').css('background-color', color.next().value);
});

Выполнением JS-кода и работой с DOM занимается один и тот же поток. То есть, у браузера нет возможности обновить "лоадер" до того, как ваш скрипт будет выполнен.

Необходимо разделить отображение "лоадера" и скрипт. Например - обернуть скрипт в setTimeout. Или (что было бы уместнее, учитывая "достаточно долгое" выполнение) вынести его в web worker.