如何更改动态添加元素的CSS?

时间:2014-03-25 12:42:56

标签: jquery dynamic-html

我正在向DOM添加几个带有“data_record”类的div。

我希望每个人在点击时都会变成一种颜色,而其他人则会变回白色背景。

这是我成功添加data_record元素后执行此操作的代码...

$(document).on('click', ".data_record", function(event) {
    //turn all others white (this DOES NOT work!)
    $('.data_record').css('background','#ffffff');

    //turn the clicked element a different colour (this DOES work!)
    $(this).css('background', '#EDC580');
});

那么如何根据他们的类来定位动态添加的元素呢?

感谢。

3 个答案:

答案 0 :(得分:2)

尝试使用.css('background-color',value)设置背景颜色:

 $(document).on('click', ".data_record", function(event) {
//turn all others white (this now works!)
    $('.data_record').css('background-color','#ffffff');

//turn the clicked element a different colour (this DOES work!)
    $(this).css('background-color', '#EDC580');
});

答案 1 :(得分:2)

这应该更改background-color

$('.data_record').css('background-color','#ffffff');

答案 2 :(得分:1)

$(document).ready(function(){
   var n=0;
    while(n<10)
    {
        $("body").append("<div class=dataRecord>Height</div>");
        n++;
    }

    $(".dataRecord").on("click",function(event){
        var self=$(this);

         $(".dataRecord").css("color","black");
        self.css("color","white");
    });

尝试小提琴  http://jsfiddle.net/sgW77/1/