Display array elements JavaScript

Question

I wanna diaplay username which means name + surname somewhere. I've got a function:

function getData(count) {
 names = ["Michał", "Jan", "Katarzyna", "Andrzej", "Józef", "Bartek", "Mikołaj", "Tomasz", "Julian", "Brajan", "Dżesika"];////////////// bez var
 var surnames = ["Noga", "Kowalski", "Nowak", "Pazura", "Duda", "Komorowski", "Tomczyk", "Józefowicz", "Lechicki", "Goldberg"];
 var result = [];
 for (var i = 0; i < count; i++) {
 var randomNameIndex = Math.floor(Math.random() * names.length);
 var randomSurnameIndex = Math.floor(Math.random() * surnames.length);
 name = names[randomNameIndex];
 var surname = surnames[randomSurnameIndex];
 result.push({
 name: name,
 surname: surname
 });
 }
 return result
}

Then I wanna display a result so I have another function:

function textDisplay() {
 //var username = name;
 //var username = names[1];
 //var username = getData(3);
 //$(username) = names[1];
 $("#nameDisplay").html(username);
}

And no one of lines in comments works. How can I display these arrays elements properly?

• Hamza El Aoutar: What do you mean 'nothing works', what's the issue that you are facing?

Answer 1

getData() returns an array of objects. You need to loop over them to get all the names.

function textDisplay() {
 var data = getData(3);
 var html = "";
 $.each(data, function(i, {name, surname}) {
 html += `Name: ${name} ${surname}<br>`;
 });
 $("#nameDisplay").html(html);
}
function getData(count) {
 names = ["Michał", "Jan", "Katarzyna", "Andrzej", "Józef", "Bartek", "Mikołaj", "Tomasz", "Julian", "Brajan", "Dżesika"]; ////////////// bez var
 var surnames = ["Noga", "Kowalski", "Nowak", "Pazura", "Duda", "Komorowski", "Tomczyk", "Józefowicz", "Lechicki", "Goldberg"];
 var result = [];
 for (var i = 0; i < count; i++) {
 var randomNameIndex = Math.floor(Math.random() * names.length);
 var randomSurnameIndex = Math.floor(Math.random() * surnames.length);
 name = names[randomNameIndex];
 var surname = surnames[randomSurnameIndex];
 result.push({
 name: name,
 surname: surname
 });
 }
 return result
}
textDisplay();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="nameDisplay"></div>

• mikitheboy: Still displays nothing
• Barmar: Click on Run code snippet, it displays the names.
• Kevin Boucher: @MikołajPrzenzak The code provided by @Barmar clearly works in the snippet. What is happening? Are there any errors in the console? Have you tried stepping through the code to see what's happening at each line? Do you even have an HTML element with an id of nameDisplay?
• mikitheboy: My fault, I missed something you added. Thank all of you