-1

I'm making an app using API from one website that stream music and I run into a problem.

When I click on play button I'm getting an error: Uncaught SyntaxError: Unexpected end of input and when I click on it it shows only this: document.getElementById(

Here is my code:

fetch(`https://api.deezer.com/playlist/3155776842`)
.then(res => res.json())
.then((data) =>{
let output = ''

data.tracks.data.forEach(track => {
    output += `<div class="artist">
    <a href="${track.artist.link}"><img src="${track.album.cover_medium}"></img></a>
    <div class="info">
    <p class="title">${track.artist.name}</p>
    <div>
    <audio id="${track.id}" src=${track.preview}></audio>
        <a onclick="document.getElementById("${track.id}").play()"><i class="fas fa-play"></i></a>
        <a onclick="document.getElementById("${track.id}").pause()"><i class="fas fa-pause"></i></a>
    </div>
    </div>
    </div>`

document.getElementById('output').innerHTML = output
});
})

The problem is in track.id

In audio tag im getting expected line:

<audio id="123456"> src="www.something.com/img"

but on a tag, I get space on left and I think that's the problem:

<a onclick="document.getElementById(" 123456").play()"><i class="fas 
fa-play"></i></a>

I tried using common-tags but it doesn't work. Also tried trim() but then I got an error: trim is not a function

Any help is welcome. Thanks

Nikola Seke
  • 122
  • 2
  • 10

1 Answers1

2
<a onclick="document.getElementById('123456').play()"><i class="fas 
fa-play"></i></a>

You have to use single quotes. Double quotes cancel each other out

Electrox Mortem
  • 319
  • 2
  • 15