gonews | golang每日新闻检索平台 | Frontend Framework library

I have a simple loading bar made with css, you update the css and the bar fills, super simple. I decided to update the bar with jQuery, works great but now I throw it into a practical environment. I have a bunch of files being downloaded and each time a file successfully downloads, it updates the position. The main problem is that it downloads the files so fast, and places the files correctly fast enough that it just doesn't update the loading bar unless I set a timeout interval of 300-400ms..it does log into console and I made an interval function that continously checks to see if a file is finished based on a global variable. No matter where I place the function to update the loading bar or how I update it, it seems the Dom will not react unless there's a big enough delay between files OR it will react at the very end (jumps to 100).

Is there any way to wait for a Dom to be updated by J's OR can you spot a problem in my code that causes this issue?

I also tried promises too but it didn't change how the browser reacts to the function.

This is all being done inside a Cordova environment but I tested it on chrome too and it works as long as the pc is powerful enough it seems.

The file Transfer function has an "on Success" too but that doesn't do anything as the Dom wont update in it until after all the downloads are done OR there's a delay

My solutions so far is to either intentionally lag the downloader, or lag it every 10 or 20 files to update the position

Edit: here's my loading bar Js