Javascript не взаимодействует с html

Есть кусок кода, который не хочет работать, при всем при этом он не выдает никаких ошибок - все, кроме него, работает, а он - нет.

Суть в том, что после клика на кнопку на сайте он должен выводить текстбокс с общей дистанцией и суммой денег, но этого не происходит, хотя и ошибок никаких не показывает.

Ссылка на код на JsFiddle

Часть кода, которая, подозреваю, работает где-то неверно:

 total_summary = '<div class="alert alert-success">';
            if (COSTOFLENGTH) {
                var summary_cost = (COST + (Math.round(distance / 100) / 10 * COSTOFLENGTH)).toFixed(2);
                total_summary += '  <strong>Total Distance : </strong>' + showDistance(distance) + " ( about " + Math.round(time / 60) + " minutes) " + "<i class='fa fa-eur' aria-hidden='true'></i> " + summary_cost;
            } else if (COST) {
                total_summary += '  <strong>Total Distance : </strong>' + showDistance(distance) + " ( about " + Math.round(time / 60) + " minutes) " + "<i class='fa fa-eur' aria-hidden='true'></i> " + COST;
            } else if (MSG) {
                total_summary += '  <strong>' + MSG + '</strong>';
            }
            total_summary += '</div>';
            $("#summary").html(total_summary);
            map_zoom = map.getZoom();
            $("#loader").html('');
        } else {
            var statusText = getDirectionStatusText(status);
            //directionsDiv.innerHTML = "An error occurred - " + statusText;
        }