Как синхронизовать два списка на странице с помощью JavaScript'a?
Два объекта кросс-связей (для более сложных нужно строить "деревья"):var sizes = {42: ["Красный", "Синий"], 43:["Зелёный","Синий"]}
var colors = {"Красный": [42], "Синий":[42,43], "Зелёный":[43]}
Данные хранить можно в массиве const data = [
  [42, 'red'],
  [44, 'red'],
  [42, 'green'],
  [44, 'green'],
  [46, 'green'],
  [42, 'blue'],
  [46, 'blue']
];
При выборе получать список подходящие значения примерно так:data.reduce((s, [size, color]) => {
  if (size == selectedSize) s.add(color);  
  return s;
}, new Set());
Набросал пример, вместо удаления option сделал просто с использованием атрибута disabled.