Я пытаюсь выбрать элемент div, который имеет 2 дочерних элемента. Они добавляются, как вы можете видеть в коде ниже. Я пытался часами без какого-либо успеха. Как бы я go собирался выбрать div с ".input-form", и это дети ??
<div class="row">
<div class="col-md">
<h1 class="m-5">Our Shoes</h1>
<table class="shoe-table">
</table>
</div>
</div>
и мой код js:
$(document).ready(function() {
let $table = $(".shoe-table");
let $inputForm = $(".input-form"); //This is not working....
fetch("shoes.json")
.then(resp => resp.json())
.then(data => {
let shoes = data.shoes;
console.log(shoes)
let rows = [1, 2, 3];
let shoeCard = "";
let counter = 0;
rows.forEach(row => {
shoeCard += "<tr>";
for (let index = 0; index < 4; index++) {
console.log(shoes[counter].image);
shoeCard += "<td class='card text-center'>" + "<img class='card-img-top' src=" + shoes[counter].image + " alt='Card image cap'>" +
"<h5 class='card-title'>" + shoes[counter].name + "</h5>" +
"<p class='card-text'>kr " + shoes[counter].price + "</p>" +
"<button id='orderNow' class='btn btn-outline-dark'>ORDER NOW</button>" +
"<div class='input-form'><input type='number' placeholder='Choose quantity' min=0 max=10><br>" +
"<button class='btn-add-to-cart' disabled='disabled'>ADD TO CART</button>"
"</div>"
"</td>";
counter++;
}
shoeCard += "</tr>";
});
$table.append(shoeCard);
})
.catch(err => console.error(err));
$("body").delegate("#orderNow", "click", function() {
console.log("FUNKAR");
$inputForm.toggle();
});
});