I'm using document.querySelector and I need it to select all divs that contains the class "test". So far querySelector selects the first div only.
How do I do that with my current JavaScript?
var removeCurveStroke = document.querySelector('.test');
if(removeCurveStroke.classList.contains('card-decorator-stroke')){
removeCurveStroke.classList.remove("card-decorator-stroke");
removeCurveStroke.classList.add("brand-curve-stroke");
}Any help is gladly appreciated. Thanks
Use document.querySelectorAll('.test');
Documetnation for querySelectorAll
document.querySelectorAll('.card-decorator-stroke').forEach(function(removeCurveStroke) {
removeCurveStroke.classList.remove("card-decorator-stroke");
removeCurveStroke.classList.add("brand-curve-stroke");
});.test{
height: 1rem;
background: blue;
}
.card-decorator-stroke {
background: red;
}
.brand-curve-stroke {
background: green;
}
<div class="test"></div>
<div class="test card-decorator-stroke"></div>not recommendable but try document.getElementsByClassName("test")
You can try with jquery
$(".test .card-decorator-stroke").addClass("brand-curve-stroke").removeClass("card-decorator-stroke");