Question

Get class from div inside an li and add to the same li.

The list items look similar to this:

<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>

...

I need to grab the class from each of the list item’s divs with an id of “three” and add it to the parent li’s class. So, after the code runs the list will look like this:

<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>

I tried something like this but it only updates the first list item:

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

Thanks in advance for your help!

Answer 1

If you are stuck with the repeating ID’s

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

})