JQuery - Set array element as attribute value for every <li>

Question

I have an array arrayDescr and I need to use forEach to add to every <li> an attribute data-value. The value of data-value should be an arrayDescr element. For example I have three <li>'s and I have two arrayDescr elements. Two of three <li>'s should have attribute data-value arrayDescr[0], [1] and etc.

This code works but I need it to work in forEach:

$("#name1").attr("data-value", arrayDescr[0])

#name should be function(){return 'name' (i+1)}. In forEach this code returns undefined:

arrayDescr.forEach(function(item, index){
$("li").attr("data-value", item[index])}

Answer 1

Here's a Vanilla Solution

var elem = document.querySelectorAll('li');

for (let i = 0; i < elem.length; i++) {
elem[i].setAttribute("data-value", "set value here, or determine how to make it dynamic"+i);
}

I haven't tested it on my end, but confident this should do what you want without JQuery and it be acceptable across many browsers (including mobile).

for (let i = 0; i < elem.length; i++) {
elem[i].setAttribute("data-value", (YourDescArray[i] !== undefined)?YourDescArray[i]:"problem");
}