Dmitry1988,
кликать на купить, строка 47 смотрите кавычки
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(function() {
let data = {
"a": {
"name": "coca-cola",
"cost": 50,
"description": "описание товара 1",
"image": "img/Coca-Cola.jpg",
"type": "drink",
"link": "goods/tb-1.html"
}
}
let buy = function() {
let obj = this.dataset.id;
let {
cost,name
} = JSON.parse(obj);
alert([name,cost]);
}
function goodsOut(data) {
// вывод на страницу
console.log(data);
let out = '';
for (let key in data) {
out += '<div class="single-goods", "col-md-3" id="' + data[key].type + '">';
out += '<a href="' + data[key].link + '"> <h3 class="goodName">' + data[key]['name'] + '</h3></a>';
out += '<p>' + data[key]['description'] + '</p>';
out += '<a href="' + data[key].link + '"><img src="' + data[key].image + '"></a>';
out += '<div class="row">';
out += '<div class="col-md-6","col-sm-12">';
out += '<p class="price">Цена: ' + data[key]['cost'] + ' ₽' + '</p>';
out += '</div>';
out += '<div class="col-md-6","col-sm-12">';
out += `<button class="add-to-cart" data-id='${JSON.stringify(data[key])}'>Купить</button>`;
out += '<p class="incart"> В корзине </p>';
out += '</div>';
out += '</div>';
out += '</div>';
}
$('#goods').html(out);
$('.add-to-cart').on('click', buy);
}
goodsOut(data)
});
</script>
</head>
<body>
<div id="goods"></div>
</body>
</html>