JSFiddle - React, Tailwind, and code Playground
HTML
<h1>Output:</h1>
<div id="output"></div>
JavaScript
//your json url
var json_url = "https://api2.libcal.com/1.0/room_bookings_nickname/?iid=3356&group_id=12306&key=92a47e5c854dee620cca071648c3fc41"
// request
$.ajax({
url: json_url,
crossDomain:true,
dataType:"jsonp"
}).done(function(response) {
// at the end of request
console.log(response.bookings);
//Yours --->response.bookings
//Mine--->response.bookings.timeslots
//access the array to loop
var rooms = response.bookings.timeslots;
$.each(rooms, function(index, element) {
create_elem(element.room_name, index);
});
});
//creating HTML element for each room
function create_elem(content,index){
var output = document.getElementById("output");
var child_elem = document.createElement("div");
child_elem.className = "child_elems";
child_elem.id = "child_elem" + index;
child_elem.innerHTML = content;
output.appendChild(child_elem);
}