从li内的div获取类并添加到同一个li

Question

从li内的div获取类并添加到相同的li。

列表项与此类似：

<li class="original">
<div id="one" class="text">foo</div>
<div id="two" class="photo">foo</div>
<div id="three" class="video">foo</div>
</li>

<li class="original">
<div id="one" class="text">foo2</div>
<div id="two" class="photo">foo2</div>
<div id="three" class="video">foo2</div>
</li>

...

我需要从列表项的每个div中获取ID为“ 3”的类，并将其添加到父级li的类中。 因此，代码运行后，列表将如下所示：

<li class="original video">
<div id="one" class="text">foo</div>
<div id="two" class="photo">foo</div>
<div id="three" class="video">foo</div>
</li>

<li class="original text">
<div id="one" class="video">foo2</div>
<div id="two" class="photo">foo2</div>
<div id="three" class="text">foo2</div>
</li>

我尝试过类似的操作，但是它只会更新第一个列表项：

$("#three").each(function(i) { 
    var newclass = $(this).attr("class");                   
   $(this).parent().addClass(newclass);
});

在此先感谢您的帮助！

Answer 1

如果您坚持使用重复ID

 $('[id="three"]').each(function(){  
     $(this).parent().addClass( this.className);

})

Answer 2

您不能有多个具有相同ID的元素。 在这种情况下，每个jquery都在做正确的事情并找到第一个ID，然后停止。 您可以改用类来解决此问题：

<li class="original video"><div class="text one">foo</div></li>
<li><div class="photo two">foo</div></li>
<li><div class="video three">foo</div></li>

<li class="original"><div class="video one">foo2</div></li>
<li><div class="text two">foo2</div></li>
<li><div class="photo three">foo2</div></li>

然后是jQuery：

$(".three").each(function(i) { 
var newclass = $(this).attr("class");                   
$(this).parent().addClass(newclass);
});

Answer 3

这是您可能要看的另一种解决方案： 演示

这是JS代码（解决了上面提到的人破碎的HTML问题之后，但保留了重复的ID）

$(document).ready(function(){

    $('.original').each(function(i) {
    var div = $(this).find('div').eq(2);
    var newclass = $(div).attr("class");                   
   $(this).addClass(newclass);
});
    });​