javascript/building-blocks/simple-ternary.html

<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Simple ternary operator example</title>
  </head>
  <body>
    <label for="theme">Select theme: </label>
    <select id="theme">
      <option value="white">White</option>
      <option value="black">Black</option>
    </select>

    <h1>This is my website</h1>

    <script>
      const select = document.querySelector('select');
      const html = document.querySelector('html');

      select.addEventListener('change', () => ( select.value === 'black' ) ? update('black','white') : update('white','black'));

      function update(bgColor, textColor) {
        html.style.backgroundColor = bgColor;
        html.style.color = textColor;
      }
    </script>
  </body>
</html>