Fechas Reservadas con Jquery

Ejemplo de Fechas Reservadas con Jquery en una tabla común

by Carlos Quintero

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<table border="1" id="tabla" class="table table-striped">
  <thead>
  <tr>
  <th><i class="fa fa-clock-o"></i> HORA</th>
  <th><i class="fa fa-calendar"></i> Lunes</th>
    <th><i class="fa fa-calendar"></i> Martes</th>
    <th><i class="fa fa-calendar"></i> Miercoles</th>
    <th><i class="fa fa-calendar"></i> Jueves</th>
    <th><i class="fa fa-calendar"></i> Viernes</th>
    <th><i class="fa fa-calendar"></i> Sábado</th>
    <th><i class="fa fa-calendar"></i> Domingo</th>
  </tr>
  </thead>
  <tbody>
  <tr>
    <td>09:00</td>
    <td id="09lun"></td>
    <td id="09mar"></td>
    <td id="09mie"></td>
    <td id="09jue"></td>
    <td id="09vie"></td>
    <td id="09sab"></td>
    <td id="09dom"></td>
  </tr>
  <tr>
    <td>09:30</td>
    <td id="093lun"></td>
    <td id="093mar"></td>
    <td id="093mie"></td>
    <td id="093jue"></td>
    <td id="093vie"></td>
    <td id="093sab"></td>
    <td id="093dom"></td>
  </tr>
  <tr>
    <td>10:00</td>
    <td id="10lun"></td>
    <td id="10mar"></td>
    <td id="10mie"></td>
    <td id="10jue"></td>
    <td id="10vie"></td>
    <td id="10sab"></td>
    <td id="10dom"></td>
  </tr>
  </tbody>
</table>

JavaScript

$(document).ready(function(){

	veri();

});


function veri(){

//fechas reservadas
var ar = ["09lun","10lun","093mar","10mie"];

//iniciamos un contador
var con = 0;

//recorremos la tabla
$('#tabla tr').find('td').each(function (i, v) {

//asignamos a una variable la id de cada td de la tabla
var ref = ($('#tabla tr').find('td')[con].id);

	//verificamos si esa id esta en el array
	if( $.inArray(ref,ar) > -1 ){
  
		//Si lo esta, le asignamos una clase 	
    $("td[id="+ref+"]").addClass('danger');
    $("td[id="+ref+"]").html("<i class='fa fa-check-square'></i> Reservado");
  
  }

//incrementamos el contador
con = parseInt(con)+1;

});

  

}