I have a loop that displays several divs, and I have a span that has a function called remove, however when I click to execute the function always the error but in html it is correct.
(function() {
//Seta valores padrões
document.querySelector('[data-js="pageTitle"]').innerHTML = datasource[0].pageName;
document.querySelector('[data-js="title"]').innerHTML = datasource[0].title;
document.querySelector('[data-js="subtitle"]').innerHTML = datasource[0].subtitle;
document.querySelector('[data-js="logo"]').src = "./images/"+datasource[0].logo;
localStorage.defaultData = JSON.stringify(datasource[0].data)
if(localStorage.default === 'true'){
var info = _getObject({key:'defaultData', typeResponse:'object'});
}else{
var info = _getObject({key:'links', typeResponse:'object'});
}
var el = document.querySelector('[data-js=items]');
var elDef = "<a href='#openModal' class='blocks blocks__default'>+</a>";
var cnt = "";
for (var i = 0; i < info.length; i++) {
cnt += "<span class='remove' onclick='remover("+info[i].id+")'>x</span>";
cnt += "<a href="+info[i].link+" id="+info[i].id+" target='_blank'>";
cnt += "<div class='blocks' title="+info[i].description+">";
cnt += "<h5>"+info[i].title+"</h5>";
cnt += "<img src='./images/"+ info[i].logo +"' alt='RH web'>";
cnt += "</div>";
cnt += "</a>";
}
cnt += elDef;
el.innerHTML = cnt;
})();
function remover(id){
console.log(id);
}In html it appears right
<span class="remove" onclick="remover(301ec16263120ee1a113a5)">x</span>
But when you click to run it always returns error.
Uncaught SyntaxError: Invalid or unexpected token