如何更改具有相同类的动态创建的单击事件 div 的颜色

Question

如何更改动态创建的div 在点击事件时的颜色，谁有相同的类？

$（这个）.css（'颜色'， '粉红色'）;有了这个，我们可以更改单击的div 颜色。

但是我想将点击的颜色更改为粉红色，并将剩余的div颜色更改为黑色。

请提供任何提示？

参考代码：

$('#main_div').on('click','class1', function(){
  $(this).css('color','pink');       
});

我有三个div 有"class1"的班级。当我单击一个div 时，该div 应该变为粉红色，其他应该变为黑色。

Answer 1

试试这个，

演示

法典：

  $("#main_div").on("click", ".class1", function () {
        $(this).css("color", "red");
        $(".class1").not(this).css("color", "black");
    });

Answer 2

尝试这样的东西，小提琴

.CSS

    .clrs{
            height:100px;
            width:100px;
            background-color: green;
            margin-bottom: 10px;
        }

JAVASCRIPT

        $(function(){
            $('.clrs').click(function(){
                $('.clrs').css('background-color','black');
                $(this).css('background-color','pink');
            })
        })

.HTML

    <div class="clrs"></div>
    <div class="clrs"></div>
    <div class="clrs"></div>
    <div class="clrs"></div>
    <div class="clrs"></div>

Answer 3

像这样尝试 .on（）：

$('body').on('click','div.yourclassname',function(){
    $(this).css('color', 'pink');
})

Answer 4

试试这个：

$("#div").on("click",".red",function(){
    $(this).css("color","pink");
});

这是小提琴

Answer 5

尝试如下：

$('#main_div').on('click','class1', function(){
  $('.class1').css('color','black').eq($(this).index()).css('color', 'pink');       
});