How can I select a split element and manipulate it DOM with JavaScript?

I have split an array and now I want to select and manipulate one or more specific elements split.

function displayAlignment(data) {
    let html = "";
    html += `<h3>Alignments</h3>`
    for (let i = 0; i < data.results[1].desc.split(/n/).length; i++) {
        html += `<p>${data.results[1].desc.split(/n/)[i]}</p>`
    }
    document.querySelector(`.content-text`).innerHTML = html
}

I want to get data.results[1].desc.split(/n/)[4], for example, and change its property style: color, font size, etc. How can I select and manipulate it? Thank you for the help.

Answer

you can either:

i) have a condition on the loop (if i === 4) and add the style inline. aka <p style="here">${data.results[1].desc.split(/n/)[i]}</p>

ii) add classes or id’s and use CSS

iii) grab it with javascript with selector or class/id if you have given one and then apply the style document.getElementById(id).style.property = new style, the link to read more.

Hopefully there are plenty of ways. Let us know !