JavaScript: установите цвет фона <td> в таблице, содержащей <select>, в зависимости от того, какой <option> выбран

Вы можете использовать свойство parentNode:

setColor = function() {
         var e = document.getElementById("select");
         e.parentNode.style.backgroundColor = e.options[e.selectedIndex].value;
      }

Вы можете немного изменить свой HTML, чтобы он стал динамическим:

<td align = "center" id = "dropdownTableData">
    <select id = "select" onchange = "setColor(this)">
        <option value = "green">pass</option>
        <option value = "red">fail</option>
        <option value = "blue" selected = "selected">none</option>
    </select>
</td>

JS:

setColor = function(element) {
    element.parentNode.style.backgroundColor = element.options[element.selectedIndex].value;
}

Вызвать при запуске:

var selectElements = document.getElementById('tableID').getElementsByTagName('select')
for (var i = 0; i < selectElements.length; i++) {
    setColor(selectElements[i]);
}

Небольшое примечание:

Хотя мой ответ устраняет проблемы, указанные в вопросе, я считаю, что ответ, который дал Чейз Ингебритсон, более элегантен и его легче поддерживать в будущем.

Я бы рекомендовал изменить classList из parentNode в зависимости от значения вашего элемента.

Чтобы отслеживать изменения в вашем <select>, может быть немного проще добавить прослушиватель событий к каждому из них. Как только ваш выбор изменится, просто вызовите функцию, которая получает родительский элемент, получает значение и изменяет класс вашего родительского элемента в зависимости от значения вашего элемента.

var data = document.querySelectorAll('#data-table tr td select');

data.forEach(function(item) {
  setColor(item);

  item.addEventListener('change', function() {
    setColor(this);
  });
});

function setColor(element) {
  var container = element.parentElement;
  container.classList.remove('none', 'pass', 'fail');

  var value = element.options[element.selectedIndex].value;
  container.classList.add(value);
}

table tr td {
  border: 1px solid black;
  padding: 5px;
}

table tr td.none {
  background-color: blue;
}

table tr td.pass {
  background-color: green;
}

table tr td.fail {
  background-color: red;
}

<table id = "data-table">
  <tr>
    <td>
      <select>
        <option value = "none" default selected>None</option>
        <option value = "pass">Pass</option>
        <option value = "fail">Fail</option>
      </select>
    </td>
    <td>
      <select>
        <option value = "none" default>None</option>
        <option value = "pass" selected>Pass</option>
        <option value = "fail">Fail</option>
      </select>
    </td>
    <td>
      <select>
        <option value = "none" default>None</option>
        <option value = "pass">Pass</option>
        <option value = "fail" selected>Fail</option>
      </select>
    </td>
  </tr>
</table>