Вообще очень странно размещать каждое значение в теге NAV.
Если все значения будут в тегагх DIV, то уже проще будет.
div.insertAdjacentHTML('beforeend', users.map(item => {
let str= '<div>';
for(let prop in item){
let data = item[prop];
str += `<div class='${prop}'>${data}</div`;
}
str += `</div>`;
return str;
}).join(''))
Ну а потом в CSS расставите стили с положением свойств в карточке.
но тут проблемка в одном из свойств объекта есть свойство address которое в свою очередь имеет свои свойства и в данном примере выводится не будут.
Если таких свойств с вложенными объектами с неизвестными именами будет много, то скрипт угадывать этот не умеет для кого какие с войства выбирать.
Вам нужно в моем примере вложить проверку на то что свойства item явялется строкой или вложенным объектом, если строкой то все ОК, если объектом то надо в условии дополнительно разваорачивать подобный цикл FOR
