buonasera a tutti

Ho un file js che riceve dati gli elabora e poi dovrebbe passare il dato a una progressbar sulla pagina html

questo :

<style type="text/css">

.progress-bar-background1 {
background-color: #white;
width: 100%;
height: 100%;
position: relative;
top: 0; left: 0;
}

.progress-bar-complete1 {
background-color: red;
width: 50%;
height: 100%;
position: relative;
top: -12px; left: 0;
}

#progress-bar1{
width: 200px;
height: 12px;
border: 2px black solid;
}

</style>


<div id="progress-bar1">
<div class="progress-bar-background1"></div>
<div class="progress-bar-complete1"></div>
</div>


devo passare il dato a .progress-bar-complete1 per l'esattezza all'attributo width: ***;
qualcuno potrebbe farmi capire come passare il dato da js esterno alla pagina, nel senso che si trova nella stessa directory, ma non è nell' html.

l'unica cosa che si avvicina che ho trovato è

document.getElementById("progress-bar-complete1").width = "100%";

che ovviamente inchioda lo script

Mi aiutate per favore? grazie

Saluti