.style is not canging element

Question

I have this script:

price2 = document.getElementById('price2');
price3 = document.getElementById('price3');

for (var i = 0; i < price2.length; i++) {
  price2[i].style.backgroundColor = 'orange';
}



  
    Ціна
     $ 1.500

Why color of this div is still blue:

There is no errors in console, I think I wrote JS correctly

user_1646240 · Answer

getElementById takes always just one element. What you want is:

let price2 = document.getElementById('price2');
let price3 = document.getElementById('price3');


price2.style.color = 'orange';

UPDATE:

If you want to update background, then just use background property:

price2.style.background = 'orange';

An example:

let price2 = document.getElementById('price2');
let price3 = document.getElementById('price3');

price2.style.background = 'orange';


      
        Ціна
         $ 1.500

user_4733161 · Answer

getElementById gives you back exactly one element, so there is no reason to use any sort of for loop.

Are you trying to style multiple elements with this id? Then id is the wrong way to go, use classes, id can only appear once on a page.

price2 = document.getElementById('price2');
price3 = document.getElementById('price3');

price2.style.color = 'orange';


  
    Ціна
     $ 1.500

.style is not canging element

2 Answers