Во-первых, приведенный ниже код должен сделать трюк самым простым способом.
var blockSet = document.getElementsByClassName("block-default").className = "block-selected";
Далее, что не так с вашим кодом, или, скорее, что интересно, что происходит:
blockSet[0].className = 'block-selected';
делает первый элемент набора блоков больше не элементом набора блоков. Это оставляет вам 7 оставшихся. Теперь
blockSet[1].className = 'block-selected';
Выбирает второй из оставшихся. Это будет третий из ваших полных списков. Теперь у вас осталось 6.
blockSet[2].className = 'block-selected';
Это делает третий среди остальных, который будет вашим BLOCK5 в выбранном блоке. И результат в том, что у вас осталось 5.
blockSet[3].className = 'block-selected';
Это снова находит ваш четвертый, который BLOCK7, когда вы считаете четвертым среди оставшихся. И теперь у вас осталось 4.
blockSet [4] не находит такого элемента и не может выполнить. Это то, что происходит с вашим кодом. Довольно интересно. :).
Вот jsfiddle, предупреждающий о ваших значениях при запуске: https://jsfiddle.net/xz7h57jv/
Кажется, мне нужно установить пользовательский порт.
Не показан здесь другой сервер WebSocket, прикрепленный к этому экземпляру Express. Похоже, что webpack-hot-клиент не работает должным образом, не указав настраиваемый порт.