btns[0].addEventListener('click', () => {
        if(btns[0].classList.contains('red')){
            btns[0].classList.remove('red')
        }else{
            btns[0].classList.add('red')
        }
    })

<div class="wrapper">
      <button class="red">1</button>
      <button>2</button>
      <button>3</button>
      <button>4</button>
      <button>5</button>
    </div>

btns[1].classList.toggle('red')

/* ClassList va Delegatsiya */

const btns = document.querySelectorAll('button'),                 /* METHOD 1 */
wrapper = document.querySelector('.wrapper')

btns.forEach(item => {
    item.addEventListener('click', () => {                         /* METHOD 2 */
         console.log('CLICKED');
    })
})

wrapper.addEventListener('click', event => {
    if(event.target && event.target.matches(('button.red'))) {        /* METHOD 3  - DELEGATSIYA */
        console.log('CLICK');
    }
})

const button = document.createElement('button')
button.classList.add('blue')
button.textContent = 6
wrapper.append(button)

window.addEventListener('DOMContentLoaded', () => {
})

 tabContent.style.display = 'none'

setTimeout(() => {
    console.log('Hello World');
    
}, 2000);

// SetTimeout bu bitta function necha dur sekunddan keyin bir marotaba ishga tushadi
// SetInterval bu bitta function har necha dur sekunda ishga tushadi

const moveCar = () => {
  const car = document.querySelector(".car");
  let postion = 0;
  const animationId = setInterval(moving , 5)

  function moving() {
    if (postion === 1000) {
      clearInterval();
    } else {
      postion++;
      car.style.left = postion + "px";
    }
  }
};

btn.addEventListener('click', moveCar)