$('.tab-button').eq(0).on('click', function(){
$('.tab-button').removeClass('orange');
$('.tab-button').eq(0).addClass('orange');
$('.tab-content').removeClass('show');
$('.tab-content').eq(0).addClass('show');
})
위의 코드를 js코드로 하려고합니다.
우선 remove를 아래와 같이 시도해봤는데
main.js:15 Uncaught TypeError: Cannot read properties of undefined (reading 'remove')
at HTMLLIElement.<anonymous> (main.js:15:31)
이런 에러가 발생하네요
document
.querySelectorAll('.tab-button')[0]
.addEventListener('click', function () {
var div = document.getElementsByClassName('tab-button');
console.log(div.classList.remove('orange'));
});
document
.querySelectorAll('.tab-button')[0]
.addEventListener('click', function () {
var div = document.getElementsByClassName('tab-button')[1];
console.log(div.classList.remove('orange'));
});
이런식으로 [1]을 써주면 잘 작동되기는 합니다만.. 제이쿼리처럼 모든 클래스명의 orange를 지우고싶은데 어떤 방법을써야할까요?
검색실력도 하찮고 머리도 하찮아서 혼자 계속 붙잡고있어도 안되네요 ㅠ..ㅠ 죄송합니다