title: How to disable time slots according to current time
body: <p>Here i have 24 time slots of a entire day, these slots have contains one single hour for booking any property.</p>
  
  <p>now i want to disable those gone time-slots which have no more uses for booking according to spent time.</p>
  
  <p><strong>Here is a pic of those time-slots</strong></p>
  
  <p><a href="https://i.stack.imgur.com/JgKPo.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JgKPo.png" alt="enter image description here"></a></p>
  
  <p><strong>here is my css for disable those time-slots</strong></p>
  
  <pre><code>.hour_slots_disabled{
       height: 40px;
       width: 75px;
       cursor: not-allowed;
       background-color: #ccc;
       border-radius: 2px;
       -o-transition:.5s;
       -ms-transition:.5s;
       -moz-transition:.5s;
       -webkit-transition:.5s;
       transition:.5s;
    }
  </code></pre>
  
  <p>Please suggest me.. Thanks</p>