How can I add different classes to multiple div elements with the same class based on their content?
<div class = "flag"> Yes </div>
<div class = "flag"> No </div>
<div class = "flag"> Yes </div>
<div class = "flag"> Yes </div>
<div class = "flag"> No </div>
To style them in CSS:
.yes {
color: green;
}
.no {
color: red;
}
I attempted the following jQuery code, but it is not working as intended:
$(".flag").each(function(){
if($(this).text().trim() == "Yes") {
$(this).addClass("yes");
} else {
$(this).addClass("no");
}
});