<div id="hoursList" class="hours__list"></div>

Pondré una etiqueta html dentro de esta clase "lista_horas".

 function booking_hours(hourArray) { console.log("heyyyy"); var table; for (var i = 0; i < hourArray.length; i++) { // if (parseInt(hourArray[i].childNodes[0].nodeValue) < 9) table += "<div data-hours='0" + hourArray[i].childNodes[0].nodeValue + ".00-0" + (parseInt(hourArray[i].childNodes[0].nodeValue) + 1) + ".00' class='hour_cell'>" + "<p>" + "0" + hourArray[i].childNodes[0].nodeValue + ".00 - 0" + (parseInt(hourArray[i].childNodes[0].nodeValue) + 1) + ".00" + "</p></div>"; } document.getElementById("hoursList").innerHTML = table.slice(9); }

Esta función trabaja con esta acción.

 function xhttp() { // Create an XMLHttpRequest object const xhttp = new XMLHttpRequest(); var hourArray; // Define a callback function xhttp.onload = function () { var parser, xmlDoc; var text = this.responseText; parser = new DOMParser(); xmlDoc = parser.parseFromString(text, "text/xml"); hourArray = xmlDoc.getElementsByTagName("item"); booking_hours(hourArray); }; // Send a request xhttp.open("GET", "hours.xml"); xhttp.send(); }

Todo está bien, hasta ahora. Pero el problema es este " $(".hour_cell").click(function ()". Esta función no funciona. Probé con consol.log pero no pude ver este mensaje. Entonces, ¿cómo puedo resolver este problema? ?Por favor, ayúdenme, quiero dejar

 // Onclick hour cell $(document).ready(function () { $(".hour_cell").click(function () { var th = $(this).data().hours.slice(0, 2); console.log("HER E"); for (var i = 0; i < counterReservedHours; i++) { if (i + 1 == counterReservedHours && reservedHours[i] != th) { counterReservedHours++; reservedHours[i] = th; break; } else if (reservedHours[i] == th) { reservedHours.splice(reservedHours.indexOf(th), 1); counterReservedHours--; break; } } $(this).toggleClass("isSelected"); }); });