визуально карточки сходятся, а код не проходит проверку, помогите понять в чем дело
var cardsData = [
{
inStock: true,
imgUrl: 'gllacy/choco.jpg',
text: 'Сливочно-кофейное с кусочками шоколада',
price: 310,
isHit: true,
specialOffer: 'Двойная порция сиропа бесплатно!'
},
{
inStock: false,
imgUrl: 'gllacy/lemon.jpg',
text: 'Сливочно-лимонное с карамельной присыпкой',
price: 125,
isHit: false
},
{
inStock: true,
imgUrl: 'gllacy/cowberry.jpg',
text: 'Сливочное с брусничным джемом',
price: 170,
isHit: false
},
{
inStock: true,
imgUrl: 'gllacy/cookie.jpg',
text: 'Сливочное с кусочками печенья',
price: 250,
isHit: false
},
{
inStock: true,
imgUrl: 'gllacy/creme-brulee.jpg',
text: 'Сливочное крем-брюле',
price: 190,
isHit: false
}
];
var makeElement = function(tagName, className, textContent) {
var element = document.createElement(tagName);
element.classList.add(className);
if (textContent) {
element.textContent = textContent;
}
return element;
}
var createCard = function (product) {
var cardItem = makeElement('li', 'good');
var cardName = makeElement('h2', 'good__description', product.text);
cardItem.appendChild(cardName);
var cardImg = makeElement('img', 'good__image');
cardImg.src = product.imgUrl;
cardImg.alt = product.text;
cardItem.appendChild(cardImg);
var cardPrice = makeElement('p','good__price', product.price)
cardItem.appendChild(cardPrice);
var availableClass = 'good--available';
if (!product.inStock) {
availableClass = 'good--unavailable';
}
cardItem.classList.add(availableClass);
if (product.isHit) {
cardItem.classList.add('good--hit');
var cardOffer = makeElement('p', 'good__special-offer', product.specialOffer)
cardItem.appendChild(cardOffer);
}
return cardItem;
}
var cardContainer = document.querySelector('.goods')
var renderCards = function (products) {
for ( var i = 0; i < products.length; i++) {
var item = createCard(products[i]);
cardContainer.appendChild(item);
}
}
renderCards(cardsData);