I'm not understanding why text changes I'm making to an element are only appearing in developer tools but not in the user interface itself.

Here's a gif of what happens when I run the function. Notice how:
• messages in console explicitly reveal alternating files
• a final "DONE" message appears when the last file is reached
• each file index in console is also appearing in the "text" element within div.current_progress

Methods I've attempted that lead to the same result:
• making sure the CSS isn't hiding, making transparent, or obfuscating the text or parent elements in any way
• element.change()
• worker threads
• changing fs sync functions to promises with nested callbacks
• changing the for loop to a recursive function
• running the progress checker as a separate, recursive function and only updating the text field after a 100ms delay until the file processing function completes
• ingesting 1.2g caffeine and staring at my screen in utter disbelief