get numbers from string and insert into css

Question

I'm working on a javascript function to use on a dev platform called Intrexx. It has its own limitations, but I believe the below code should work. It is supposed to get then numbers inside an array, calculate a percentage according to what it finds and return that percentage to set the width of the progress bar. Everything works as intended, except the altering of the design part. Any ideas why?

function progressBar(){
// get text of navigation (eg: 3 of 28) 
var textProgress = document.getElementById('ID_navigationinfocontrolAB63A4D8').firstElementChild.innerHTML

// get numbers inside above string as array
var a = textProgress.match(/\d+/g).map(Number)

// take numbers in array, calculate percentage of progress, return int
var progressPercentage = parseInt((a[0]*100)/a[1])

// alter design of progress bar
var progressBarDesign = document.getElementById('ID_separatorcontrolC6F8BAC8').parentNode
progressBarDesign.style.width = progressPercentage +'% !important' }

I tried to edit the element directly, but neither this, nor editing the parentNode works.

Answer 1

To set important you can use the following syntax

 progressBarDesign.style.setProperty("width", progressPercentage + '%', "important");

Or if you're okay with not using important the current syntax should work fine.

progressBarDesign.style.width = progressPercentage + '%';