javascript - 使用javascript将颜色添加到动态创建的表格列中

MyHtml表

<table border="1" id="pay">
<thead>
<th>#</th>
<th>Admission No</th>
<th>Student Name</th>
<th>Paid Amount</th>
<th>Jan </th>
<th>Feb </th>
<th>March </th>
<th>April</th>
<th>May</th>
<th>June</th>
<th>July</th>
<th>Aug</th>
<th>Sep</th>
<th>Oct</th>
<th>Nov</th>
<th>Dec</th>
</thead>

<tbody id="payCompClass">

</tbody>
</table>

这是我的Javascript函数，

            $.each(data["students"], function (i, item) {

            trHTML += '<tr>' +
                '<td>' + (i+1) + '</td>' +
                '<td>' + item['stuid'] + '</td>' +
                '<td>' + item['stu_name'] + '</td>' +
                '<td>' + item['fullpayment'] + '</td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>' +
                        '<td></td>'

                +'</tr>';

        });


     for (var y = 0; y <item['fullpayment'] ; y++) {
            $('<td></td>').style.backgroundColor = "red";
     }







        $('#payCompClass').html(trHTML);

数据是从ajax返回的数组，
它拥有这样的价值，

   |id  | stuid |fullname   |fullpayment |
   |0   | 1010  |abcName    |3 |
   |1   | 1011  |abcName    |2 |
   |2   | 1012  |abcName    |1 |
   |3   | 1013  |efgName    |1 |

我想要的是根据全额付款的方式在表格列中填充颜色，是否有一种很好的方法来实现这一目标。类似于此，

   |#   | Admission |fullname|fullpayment |Jan|Feb|Mar|Apr|May|....|Dec|
   |0   | 1010  |abcName     |3           |red|red|red|no |no|.... |no|
   |1   | 1011  |abcName     |2           |red|red|no |no |no|.... |no|
   |2   | 1012  |abcName     |1           |red|no |no |no |no|.... |no|
   |3   | 1013  |efgName     |1           |red|no |no |no |no|.... |no|

我已经在trHtml代码的末尾尝试了for循环，但是没有用，有人可以为此建议解决方案，
谢谢。

最佳答案

您想在12个月内检查全额付款，因此请循环查看并在.....个月内核对付款月份。

 $.each(data["students"],function(i,item){
    var html = "<tr>";
    html += "<td>"+i+"</td><td>"+item.stuid+"</td><td>"+item.stu_name+"</td>"+
            "<td>"+item.fullpayment+"</td>";
    //checking payment month
    for(var i = 0;i < 12;i++) {
        if(i < item.fullpayment) {
            html += "<td bgcolor='red'></td>";
        } else {
            html += "<td>no</td>";
        }
    }
    $("tbody").append(html+"</tr>");
 });