How can i add style to the element in javascript?

Question

I have this piece of code inside my javascript, I want to select the element by the class name and then be able to style it, how can I do that?

const versesHtml = `              
                ${verses.map( (v, i) => `<li class="text">${v.text_uthmani}</li> <li class="ayahNumber">{${i+1}}</li>`).join(' ')}
               
                
               
            `;

I think there could be applying the changes, as you insert the elements dynamically. — Dan Friedman, Mar 19 '22 at 09:31

score 0 · Answer 1 · answered Mar 19 '22 at 09:22

0

using the DOM selector and then css properties, like this:

const styling = document.querySelector('.text');
styling.style.backgroundColor = 'yellow';
styling.style.color = 'red';

answered Mar 19 '22 at 09:22

Gabriele Sabatino

136
1
8

score -1 · Accepted Answer · answered Mar 19 '22 at 09:21

-1

var elements = document.getElementsByClassName('ayahNumber'); // get all elements
    for(var i = 0; i < elements.length; i++){
        elements[i].style.backgroundColor = "black";
    }

answered Mar 19 '22 at 09:21

dinesh oz

342
1
9

How can i add style to the element in javascript?

2 Answers2