How to change the class of several tds of table when hovering over one of them using JQuery?

<style type="text/css">

.blocked {
   color: white;
   background-color: red;
}

.start {
   border-left: 5px solid black;
}

.end {
   border-right: 5px solid black;
}

.blocked-highlight {
   background-color: blue;
}

</style>

<script type="text/javascript" src="jquery-1.11.1.min.js"></script>

<table>
    <thead><tr>
            <th>Monday</th>
            <th>Tuesday</th>
            <th>Wednesday</th>
            <th>Thursday</th>
            <th>Friday</th>
            <th>Saturday</th>
            <th>Sunday</th>
    </tr></thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
            <td>6</td>
            <td>7</td>
        </tr>
        <tr>
            <td>8</td>
            <td>9</td>
            <td>10</td>
            <td>11</td>
            <td>12</td>
            <td>13</td>
            <td>14</td>
        </tr>
        <tr>
            <td>15</td>
            <td>16</td>
            <td class="blocked start">17</td>
            <td class="blocked">18</td>
            <td class="blocked">19</td>
            <td class="blocked">20</td>
            <td class="blocked">21</td>
        </tr>
        <tr>
            <td class="blocked">22</td>
            <td class="blocked">23</td>
            <td class="blocked end">24</td>
            <td>25</td>
            <td>26</td>
            <td>27</td>
            <td>28</td>
        </tr>
        <tr>
            <td>29</td>
            <td>30</td>
            <td>31</td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </tbody>
 </table>

 <script type="text/javascript">

$( document ).ready(function() {
   $("td.blocked").hover(
       function() {
           $( this ).siblings('.blocked').addBack(".blocked").addClass('blocked-highlight')
       }, function() {
           $( this ).siblings('.blocked').addBack(".blocked").removeClass('blocked-highlight')
       }
   );
});

 </script>


Output :)

1)

2)

3)