Creating a room allocation page with multiple panel boxes using Bootstrap. Each box represents a bed - highlighted in red if occupied and green if vacant. Clicking on a green panel redirects to the room allocation page, while clicking on a red panel goes to the room vacate page. How can I achieve this development efficiently using Bootstrap and JQuery?
function highlightBed(id){
if($(id).text()=="")
$(id).prev().parent().prev().css("background-color","green");
else
$(id).prev().parent().prev().css("background-color","red");
}
//I want to call the same function on page load for multiple ids, currently only able to do so individually on click events.