Listen Closely explainer

it worked for me
thank you!!

1 Like

Can someone tell me what I did wrong please?

import { animals } from 'animalShelter.data';

let title = document.createElement('h1');
title.textContent = 'Adoptable Animals';
document.body.appendChild(title);

for (let animal of animals) {
    
    let animalName = document.createElement('h2');
    animalName.textContent = animal[0];
    document.body.appendChild(animalName);
    
    let picture = document.createElement('img');
    picture.src = animal[1];
    document.body.appendChild(picture);
    
    let description = document.createElement('p');
    description.textContent = animal[2];
    document.body.appendChild(description);
    
    let button = document.createElement('button');
    button.textContent = 'Like';
    document.body.appendChild(button);
    
    button.addEventListener('click', () => {
        if ( button.textContent === 'Like'){
            button.textContent = 'Liked!';}
            else {
                button.textContent = 'Like'}
            }

EDITED
Never mind, I have figured it out.

1 Like

I finished the task but it still give my a triangle warning sign ->“Dont make functions within a loop”
why ?

import { animals } from 'animalShelter.data';

let title = document.createElement('h1');
title.textContent = 'Adoptable Animals';
document.body.appendChild(title);

for (let animal of animals) {
    
    let animalName = document.createElement('h2');
    animalName.textContent = animal[0];
    document.body.appendChild(animalName);
    
    let picture = document.createElement('img');
    picture.src = animal[1];
    document.body.appendChild(picture);
    
    let description = document.createElement('p');
    description.textContent = animal[2];
    document.body.appendChild(description);
    
    let button = document.createElement('button');
    button.textContent = 'Like';
    document.body.appendChild(button);
    button.addEventListener('click', ()=>{
      if( button.textContent=== 'Like'){ button.textContent = 'Liked!'} else
   { button.textContent = 'Like'}});
}

This worked well to me

Hello @Filipi. Try To Post A Screenshot So That i can take a look. Or if You Can’t. Let Me Lend A Hand Please.

Have You Make A Function Like This For Example:

function chooseNumber(___)

Don’t Add it in a loop. As The Code for...of repeats the code. So it is not a good idea to add a function in a loop. As What for...loop does, it Loop Means it Will Repeat. And it is not a good idea to have a function overwritten ok.

I Can Give The Code that i am looking for in this topic.

import { animals } from 'animalShelter.data';

let title = document.createElement('h1');
title.textContent = 'Adoptable Animals';
document.body.appendChild(title);

for (let animal of animals) {
    
    let animalName = document.createElement('h2');
    animalName.textContent = animal[0];
    document.body.appendChild(animalName);
    
    let picture = document.createElement('img');
    picture.src = animal[1];
    document.body.appendChild(picture);
    
    let description = document.createElement('p');
    description.textContent = animal[2];
    document.body.appendChild(description);
    
    let button = document.createElement('button');
    button.textContent = 'Like';
    document.body.appendChild(button);
    
    let button = document.getElementById('button');
button.addEventListener('click', () => 
    if button​.textContent = 'Like'; {
    button.textContent = 'Liked';
}
                                       {
    else 
    button.textContent = 'Like';
});
    
    
}
}

Hope This Helps

Abraham

Hey there. When copying and pasting the code, you will put 3 backticks (```) above and below the code. For example, I put the text between 3 backticks and typed the word ‘javascript’, like this:

let button = document.getElementById('button');

This is formatted:

console.log("Hi");

This is not formatted:
console.log(“Hi”);

I’ve created a separate guide that teach everyone on formatting code.

Link to the topic!

Thanks,
Pummarin :slightly_smiling_face:

what’s wrong with my code. Please someone help me

Screenshot 2020-09-18 at 7.11.00 AM
I dont know whats wrong. can someone help

hi im kinda stuck since i dont get my codeisnt working


Ive been stuck on this for a week, please help.

1 Like

Hi. I am getting some error here. This is my code.

import { animals } from ‘animalShelter.data’;

let title = document.createElement(‘h1’);
title.textContent = ‘Adoptable Animals’;
document.body.appendChild(title);

for (let animal of animals) {

let animalName = document.createElement('h2');
animalName.textContent = animal[0];
document.body.appendChild(animalName);

let picture = document.createElement('img');
picture.src = animal[1];
document.body.appendChild(picture);

let description = document.createElement('p');
description.textContent = animal[2];
document.body.appendChild(description);

let button = document.createElement('button');
button.textContent = 'Like';
document.body.appendChild(button);
button.addEventListener('click', ()=>{
    if button.textContent === 'Like';{
button.textContent = 'Liked!';

}
else {
button.textContent = ‘Like’;
}
}
Can you help me fix?

@Grasshopper_Ben
Can you please help with the reply on the top?

Give the answer along with the reply also please.
Please? Please? Please? Please? Please? Please? Please? Please? Please? Please? Please? Please? Please? Please? Please? Please? I am stuck urgently!!! I need some help and nobody is replying.
I edited this because no body is replying.

this is my code, as an issue, my line “button.addEventListener(‘click’, () => {if (button.textContent === ‘Like’)” was flagged with the tip “don’t make functions within a loop” and I don’t know how to fix it.

import { animals } from ‘animalShelter.data’;

let title = document.createElement(‘h1’);
title.textContent = ‘Adoptable Animals’;
document.body.appendChild(title);

for (let animal of animals) {

let animalName = document.createElement('h2');
animalName.textContent = animal[0];
document.body.appendChild(animalName);

let picture = document.createElement('img');
picture.src = animal[1];
document.body.appendChild(picture);

let description = document.createElement('p');
description.textContent = animal[2];
document.body.appendChild(description);

let button = document.createElement('button');
button.textContent = 'Like';
document.body.appendChild(button)
button.addEventListener('click', () => {if (button.textContent === 'Like')
    {
        set; button.textContent === 'Liked!'
} else { set; button.textContent === 'Like'}})}

tysm

You should not put it inside the loop. You should put it outside the loop.

This is the correct code Ryan
import { animals } from ‘animalShelter.data’;

let title = document.createElement(‘h1’);
title.textContent = ‘Adoptable Animals’;
document.body.appendChild(title);

for (let animal of animals) {

let animalName = document.createElement('h2');
animalName.textContent = animal[0];
document.body.appendChild(animalName);

let picture = document.createElement('img');
picture.src = animal[1];
document.body.appendChild(picture);

let description = document.createElement('p');
description.textContent = animal[2];
document.body.appendChild(description);

let button = document.createElement('button');
button.textContent = 'Like';
document.body.appendChild(button);

button.addEventListener('click', () => {
if (button.textContent === 'Like'){
button.textContent = 'Liked!';}

else{
button.textContent = ‘Like’;

}
})
}

I entered this exactly but on line 26, it said “Don’t make functions within a loop”. Do you know how I could fix this?

thank you for your help! May i ask which part is it?

Sure. Of course. You can.

1 Like

Which part is the ‘it’ that needs to be outside of the loop.

1 Like