Jquery 尝试动态更改div的类时addClass不工作

这里怎么了？在我这边，我已经尝试了一切，但似乎没有任何效果

<div class="main">
    <div class="qty" style="float:left">1</div>
    <div class="name" >A</div>    
</div>
<div id="main">
    <div class="qty" style="float:left">2</div>
    <div class="name">B</div>    
</div>
<input type="button" id="ADD">


$('#main').on('click', function(){
        $(this).addClass('selected');
    });
$('.name').on('click', function(){
        $(this).addClass('selected');
    });
$('.qty').on('click', function(){
        $(this).addClass('selected');
    });

$('#ADD').click( function(){
        $(".selected").nearest(".qty").text($(".selected").nearest(".qty").text() +1);
    });

1.
A.
2.
B
$（'#main'）。在（'click'，function（）上{
$（this.addClass（'selected'）；
});
$（'.name'）。在（'click'，function（）上{
$（this.addClass（'selected'）；
});
$（'qty'）。在（'click'，function（）上{
$（this.addClass（'selected'）；
});
$（'#添加'）。单击（函数（）{
$（“.selected”）.最近（“.qty”）.text（$（“.selected”）.最近（.qty”）.text（）+1）；
});

您的代码正在尝试向每个单击的元素添加CSS类。如果要添加类属性，请执行以下操作：

$('#main').on('click', function(){
    $(this).attr('class', 'selected');
});

如果要应用CSS类，请在样式标记中创建选定的类

<style>
    .selected {
        color: blue;
    }
</style>

---

如果问题是您的第二个

未获得所选的

类，那是因为在DOM上不能有多个与中相同ID的项

将
main
更改为类，它将按预期工作

HTML

<div class="main">
    <div class="qty" style="float:left">1</div>
    <div class="name" >A</div>    
</div>
<div class="main">
    <div class="qty" style="float:left">2</div>
    <div class="name">B</div>    
</div>
<input type="button" id="ADD">

您可能想看看您的web浏览器的控制台。
最近的
方法是一个问题。可能会放入$（文档）。就绪（{…}）我也尝试过在每个控制台中添加一个类，但不起作用。您还有两个
id=“main”
元素。。
<div class="main">
    <div class="qty" style="float:left">1</div>
    <div class="name" >A</div>    
</div>
<div class="main">
    <div class="qty" style="float:left">2</div>
    <div class="name">B</div>    
</div>
<input type="button" id="ADD">

$('.main').on('click', function(){
    $(this).addClass('selected');
});