I tried to output data from my array in a div with id="container" but it is not working. Can anyone please help me to fix it?

Question

Thanks in advance and here is the code

var markup = function(name, email, country){
return `
<div class="card">
${name} <br> ${email} <br> ${country}
</div>
`;
};

var data = [
{
name: "Ryan Zico",
email: "[e-mail]",
country: "Philippines"
}
];

var container = document.getElementById("container");
for(var i = 0; i < data.length; i++) {
container.innerHTML += markup(data[i].name, data[i].email, data[i].country)
}

Answer 1

Here is the link

https://code.sololearn.com/W2nQJ5ULVF3r/?ref=app

Answer 2

Ipang I thought it might be something like that. Ryan Zico (Challenge Me) what version of the app do you have? Can you try it on a modern browser to see if you still get an error?

Anyway, line 12 is where the backticks start which as we know is ES6, but if Ryan changed var markup to const markup, then line 11 would've errored.

Answer 3

I'm using version 3.4.4
Thats what my phone can hold because i installed it from the play store

Answer 4

In my (previously) older phone which had a thing with ES6, I couldn't even use `let` without having the app to yell at me.

Answer 5

Can you post a link to your code? I'm wondering if you have the HTML set up right. Also, you may be calling the Java code too early (before the DOM has loaded).

Answer 6

It looks like it's working. Your array has 1 object with 3 key-value pairs. I see all 3 values being outputted within a div on the screen.

What were you expecting?

Answer 7

But its not working here

Console says:
Uncaught Syntax Error
Unexpected token ILLEGAL
Line: 12

Answer 8

It's working for me. I just copied your code into a new code but just to double check.

Can you try this one to see if you're still getting an error in the console?

https://code.sololearn.com/Wu2156B4HIdA/?ref=app

Answer 9

Ryan,
What happens if you replace all `var` in the script by `let`? does it work?

Answer 10

I will try that

Answer 11

Console still says same

Answer 12

Ryan,
I was guessing maybe your device doesn't fully support ES6. String interpolation came with ES6, but changing `var` to `let` doesn't seem to be causing any problem. So my guess maybe wrong.

Answer 13

Oooh
So its all from my phone
Thanks for the tip

Answer 14

Ryan,
Which Android version in the phone?
Or is it using iOS?