var thumbLength = $('.thumb').length;
for (var i = 0; i < thumbLength; i++) {

    $('#thumb-' + i).hover(
        function () {
            $('#img-' + i).addClass('hover');
        },
            $('#img-' + i).removeClass('hover');
        }
    );
}

<ul>
    <li class="thumb" id='#thumb-0'>Milk</li>
    <li class="thumb" id='#thumb-1'>Bread</li>
    <li class="thumb" id='#thumb-2'>Chips</li>
    <li class="thumb" id='#thumb-3'>Socks</li>
  </ul>
<div class='img' id='#img-0'>Milk</div>
<div class='img' id='#img-1'>Bread</div>
<div class='img' id='#img-2'>Chips</div>
<div class='img' id='#img-3'>Socks</div>

.hover{
    color:green;
    font-size: 20px;
}