js 嵌套循环问题 修改样式

Question

    <div><p id="1">aa</p></div>
    <div><p id="2">aa</p></div>
    <div><p id="32">aa</p></div>
    <div><p id="44">aa</p></div>
    <div><p id="8">aa</p></div>
    <div><p id="13">aa</p></div>
    <div><p id="4">aa</p></div>
    <div><p id="11">aa</p></div>

var aa=[{"id":1,"name":"yi"},{"id":4,"name":"si"},{"id":6,"name":"liu"},{"id":8,"name":"ba"},{"id":"a","name":"aaa"}];

我想把id在数组aa中的div加上class="a"
否则加上class="b"

如果我这样写：

    var div = $("div");
    for (var i = 0; i < aa.length; i++) {
        var tId = aa[i].id;
        for (var j = 0; j < div.length; j++) {
            var fId = $(div[j]).find("p").attr("id");
            if (tId == fId) {
                div.addClass("a");
            } else {
                div.addClass("b")
            }
        }
    }

结果每个div都变成了

 <div class="a b">

，我只是想把包含

id="1"和id="4"的div加上class="a",是我的循环出了什么问题么，要怎么修改呢？

Answer 1

div是所有的div不是当前的div，所以div加减class都是同步的。
可以转换思路，先统一加上class b，然后匹配的div先删掉class b，再加上class a

 var div = $("div");
 div.addClass("b");
    for (var i = 0; i < aa.length; i++) {
        var tId = aa[i].id;
        for (var j = 0; j < div.length; j++) {
            var fId = $(div[j]).find("p").attr("id");
            if (tId == fId) {
                                $(div[j]).removeClass("b");
                $(div[j]).addClass("a");
            }
        }
    }