My results are ONLY appearing after I close the prompt window, have two versions of the code, can you please advice?

I find a lot of people has the same problem, i have answered my solution in the previously question, but still, post here again, wish this help, you can find my explain in the previously question.

It is really not a common way in the real world use prompt method in the while loop, because prompt stop browser processing code and affect code work flow. When it comes to ask users input data, coders usually custom their own dialog, but this require other skill.

So teacher use prompt here just because this is the easiest way ask user input something.

var message,student,search;

function print(message) {
  var outputDiv = document.getElementById('output');
  outputDiv.innerHTML = message;
}

function getStudentReport(student){
   var report = '<h2>Student: ' + student.name + '</h2>';
  report += '<p>Track: ' + student.track + '</p>';
  report += '<p>Points: ' + student.points + '</p>';
  report += '<p>Achievements: ' + student.achievements + '</p>';
  return report;
}

promptSearch();  //excute function first time;

function promptSearch(){
  var flag = true;
  while(flag){
     search = prompt("type a name:  (type 'quit' to exit)");
     if(search.toLowerCase() === 'quit' || search === null ){
       break;
      }
     for (var i = 0; i < students.length; i += 1) {
       student = students[i];
       if (student.name === search){
          message =  getStudentReport(student);
          print(message);
          flag = false;  //stop the while loop first
          setTimeout(promptSearch,100);  //wait 0.1 sec then prompt again
       }
     }
  }
}

With the way your while loop is set up, it won't show results until it is broken. The javascript is being executed as the page loads, and the input request within the while loop is synchronous, meaning that it will not 'finish loading' until the whole of the javascript is executed.

while(true) does not verify any set of conditions and will ALWAYS run because true === true, until something from within breaks and let's the rest of the code run.

For the HTML to load first and then request the user input through the dialog, it would have to be triggered by a function after the page is loaded. Something similar to how with jQuery code, any code is run 'on load', meaning after the page is done loading.

I even went back to watch the video and I can only hope that, in later lessons, they will explain how to make the code execute in a better way. There were many students who asked similar a question and were confused.

What I know is, when the break statement is used in a loop, it breaks the loop but continues executing the code after the loop (if any). In our example, we have code after the break statement inside the while loop. Therefore, this code will continue executing.
As Anvar said, I still cannot understand how Dave could manage to display the student record without "stopping" the loop as Chung-Jun Wang did here in her example!!!

ANYONE?