Check the link to Element.classList
again -- there's also a .remove()
method... ;-)
if (event.target.value === 'condition_2') {
classOne.classList.add('newclass')
} else {
classOne.classList.remove('newclass')
}
You might also conditionally .toggle()
the class, which would be more elegant but sadly also without IE support...
classOne.classList.toggle(
'newclass',
event.target.value === 'condition_2'
)
Currently the select.value
gets only checked on change events, so you'd have to do this initially too:
var checkSelect = function () {
if (select.value === 'condition_2') {
classOne.classList.add('newclass')
} else {
classOne.classList.remove('newclass')
}
}
// Do the check initially...
checkSelect()
// ... and on change events
select.addEventListener('change', checkSelect)