<div class="hello">
  <h1>Click me!</h1>
</div>
const h1 = document.querySelector('div.hello:first-child h1');

function handleTitleClick(){
  
  const currentColor = h1.style.color;
  let newColor;
  
  //현재 h1.style.color가 blue일 경우
  if (currentColor === 'blue') {
    
    //newColor 변수에 tomato 값 담기
    newColor = 'tomato';
  } else {
    
    //newColor 변수에 blue 값 담기
    newColor = 'blue';
  }
  
  //조건문 통과하면서 newColor에 blue or tomato 값이 담김
  
  //h1.style.color에 담긴 값(newColor) 넣기
  h1.style.color = newColor;
}

h1.addEventListener('click', handleTitleClick);

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.