Remember, each element on a page must have a unique ID. Using document.getElementById() will only target the first element with that specific ID.
In the code snippet you've shared, it keeps updating the same element's href repeatedly within a loop over an array of objects.
If you're handling multiple elements that share similar characteristics, consider utilizing classes.
Take a look at this example assuming your HTML classes align with the object array and are ordered as expected. It should help guide you in the right direction.
HTML
<ul>
<li class="myClass"></li>
<li class="myClass"></li>
<li class="myClass"></li>
<li class="myClass"></li>
<li class="myClass"></li>
<li class="myClass"></li>
</ul>
JS (using jQuery because it seems you're familiar with it already)
var projects = { 'projects' :
[
{'url' : 'zero'},
{'url' : 'one'},
{'url' : 'two'},
{'url' : 'three'},
{'url' : 'four'},
{'url' : 'five'}
]
};
$('.myClass').each(function (index) {
$(this).text(projects.projects[index].url);
});