0xD34F

Куда надо записывать текст, и откуда его брать:

const input = document.querySelector('#textLink');
const buttonSelector = '.link';

Как достать текст, имея на руках элемент:

const getText = el => el.innerText;
// или
const getText = el => el.textContent;
// или (будет работать как надо, пока элемент остаётся ссылкой)
const getText = el => el.text;
// или (будет работать как надо, пока вложенные элементы не появятся)
const getText = el => el.innerHTML;

Делегирование, назначаем обработчик клика один раз:

document.addEventListener('click', ({ target: t }) =>
  (t = t.closest(buttonSelector)) &&
  (input.value = getText(t))
);

Или, назначаем обработчик клика каждому элементу индивидуально:

document.querySelectorAll(buttonSelector).forEach(function(n) {
  n.addEventListener('click', this);
}, e => input.value = getText(e.currentTarget));

<select id="departure"></select>
<select id="destination"></select>
<select id="type">
  <option value="1">в одну сторону</option>
  <option value="2">туда и обратно</option>
</select>
<div id="price"></div>

const routes = [
  [ 'Хабаровск',      'Казань', 100 ],
  [ 'Хабаровск',        'Омск', 200 ],
  [ 'Хабаровск', 'Владивосток', 300 ],
  [ 'Хабаровск',     'Иркутск', 400 ],
  [ 'Хабаровск',      'Москва', 500 ],
  [    'Тюмень',    'Владимир', 234 ],
  [    'Тюмень',  'Красноярск', 345 ],
  [    'Тюмень',         'СПб', 456 ],
  [    'Тюмень',      'Москва', 567 ],
  [    'Тюмень',      'Якутск', 678 ],
];

const prices = routes.reduce((acc, n) => (
  (acc[n[0]] = acc[n[0]] || [])[n[1]] = n[2],
  (acc[n[1]] = acc[n[1]] || [])[n[0]] = n[2],
  acc
), {});

const setOptions = (el, options) =>
  el.innerHTML = options.map(n => `<option>${n}</option>`).join('');

const updatePrice = () =>
  price.textContent = type.value * prices[departure.value][destination.value];

const departure = document.querySelector('#departure');
const destination = document.querySelector('#destination');
const type = document.querySelector('#type');
const price = document.querySelector('#price');

type.addEventListener('change', updatePrice);
destination.addEventListener('change', updatePrice);
departure.addEventListener('change', e => {
  setOptions(destination, Object.keys(prices[e.target.value]));
  updatePrice();
});

setOptions(departure, Object.keys(prices));
departure.dispatchEvent(new Event('change'));

$('select')
  .last()
  .clone()
  .attr('id', (i, id) => id.replace(/\d+$/, m => +m + 1))
  .appendTo('body');

Не вижу явного удаления из дом дерева.

Неявно тоже ничего не удаляется - элемент перенесён в .js-select-tabs-head, неужели этого не видно? Или вы думаете, что там другой элемент, копия? Это не так - можете получить элемент до вызова html, после, сравнить их, увидите, что это один и тот же элемент.

Хотите, чтобы происходило копирование вместо перемещения... Ну, очевидно же:

$head.html($text.filter('.is-active').clone()).

При подключении обработчиков клика к кнопкам навигации, сами кнопки вы ищите внутри формы - а их там нет.

Замените

form.on("click", ".next", function(event) {

на

$(".next").on("click", function(event) {

Аналогично и с .back.

Ну или засуньте кнопки в форму.

При замене вместо строки используйте регулярное выражение, соответствующее строке и произвольному количеству символов. Т.е, замените

this.api = this.api.replace(word, 'BOOM')

на что-то вроде

this.api = this.api.replace(RegExp(`\\b${word}[a-z]*\\b`, 'ig'), 'BOOM')

Возвращайте this из всех методов, которые могут быть не последними в цепочке вызовов:

function calc(val) {
  const self = Object.create(calc.prototype);
  self.val = val;
  return self;
}
calc.prototype = {
  plus(val) {
    this.val += val;
    return this;
  },
  minus(val) {
    this.val -= val;
    return this;
  },
  valueOf() {
    return this.val;
  },
};

+calc(0).plus(1); // 1
+calc(1).plus(1).plus(1); // 3
+calc(1).plus(2).plus(3).plus(4).minus(5); // 5
calc(3).plus(7).minus(2) * 3; // 24
99 + calc(1); // 100

Создаём новый массив:

const newArr = arr.slice(-5);

Или, обновляем существующий:

arr.splice(0, arr.length - 5);

const uniqueWithSum = (arr, idKey, sumKey) =>
  Object.values(arr.reduce((acc, n) => (
    acc[n[idKey]] = acc[n[idKey]] || { ...n, [sumKey]: 0 },
    acc[n[idKey]][sumKey] += n[sumKey],
    acc
  ), {}));

const result = uniqueWithSum([ ...a, ...b ], 'id', 'count');

const kebab = str => str.replace(/\b([A-Z][a-z]*)+\b/g, n => n.replace(/([A-Z])/g, '-$1').replace(/^-/, '').toLowerCase());

console.log(kebab('KebabCase noKebabCase No_Kebab_Case And FuckDonaldTrump!!')); // "kebab-case noKebabCase No_Kebab_Case and fuck-donald-trump!!"

for (const n of words) {
  string = string.replace(RegExp(`\\b${n}\\b`, 'gi'), m => `<a href="#">${m}</a>`);
}

или

const newString = words.reduce((acc, n) => {
  return acc.replace(RegExp(`\\b${n}\\b`, 'gi'), '<a href="#">$&</a>');
}, string);

Посмотрел поддержку forEach: она отличная.

Это другой forEach - принадлежащий Array.prototype. У вас ошибка возникает из-за отсутствия NodeList.prototype.forEach.

Что можно сделать:

• Найти/написать самостоятельно и добавить полифилл
  
• Использовать forEach массива:
  
  

  Array.prototype.forEach.call(items, function(n) {
    // ...
  });

  
  
• Использовать обычный цикл со счётчиком:
  
  

  for (var i = 0; i < items.length; i++) {
    // ...
  }

  
  
• В IE не заработает, а вот в Safari 9, говорят, должно:
  
  

  for (var n of items) {
    // ...
  }

  
  

Проверяйте, существует ли элемент, который пытаетесь удалить:

const el = currentTarget.querySelector('селектор элемента');
if (el) {
  el.remove();
}

Из какой таблицы и какого столбца надо получить данные:

const tableEl = document.querySelector('селектор_таблицы');
const colIndex = индекс_столбца;

Получаем:

const colData = Array.from(
  tableEl.rows,
  ({ cells: { [colIndex]: n } }) => n && n.textContent
);

// или

const colData = Array.prototype.map.call(
  tableEl.querySelectorAll(`tr > :nth-child(${colIndex + 1})`),
  n => n.innerText
);

// или

const colData = [];
for (const n of table.querySelectorAll('tr')) {
  colData.push((n.children[colIndex] || {}).innerHTML);
}

Где элементы находятся и какой класс надо удалить:

const parentSelector = '.parent';
const className = 'custom';

Удаляем:

document.querySelectorAll(`${parentSelector} > .${className}`).forEach(n => {
  n.classList.remove(className);
});

// или

for (const n of document.querySelector(parentSelector).children) {
  n.className = n.className.replace(RegExp(`(^| )${className}(?= |$)`), '').trim();
}

По клику на .colors вызывайте функцию пересчёта:

$('.colors').on('click', '.color', function() {
  $(this).toggleClass('checked');
  calculate();
});

В самой функции добавьте обход .colors .checked и суммирование их data-price:

total += $('.colors .checked', this)
  .get()
  .reduce((acc, n) => acc + +n.dataset.price, 0);

const values = Array.from(
  document.querySelectorAll('.aside input[type="checkbox"]:checked'),
  n => n.value
);

Почему console.log('\n' == separator.value); возвращает false?

Потому что \n - это перенос строки. Экранируйте слэш - '\\n' == separator.value.

погуглил за вас