Hi, I'm in a situation in which I need to use .wrap and :first-child.

This is what I am doing:

<script>$("a").wrap("<div class='category-wrapper'></div>");</script>
<script>$("div.category-wrapper:first-child").addClass("first");</script> 

This should render a div.category-wrapper outside a link and then add a "first" class to every first div.category-wrapper.

The output is:

<div class="category-wrapper"><a href="#">Test</a></div>

Which is good! However, I am not able to get the "first-child" to work (it doesn't adds the "first" class). If I use it somewhere else it works so I am sure it's something related to the dynamic rendering of the previous element.

Any help is appreciated!

Thanks!

Sample output would be:

<div class="category-wrapper"><a href="#">Test #1</a></div>
<div class="category-wrapper"><a href="#">Test #2</a></div>
<div class="category-wrapper"><a href="#">Test #3</a></div>
<div class="category-wrapper"><a href="#">Test #4</a></div>

Desired output:

<div class="category-wrapper first"><a href="#">Test #1</a></div>
<div class="category-wrapper"><a href="#">Test #2</a></div>
<div class="category-wrapper"><a href="#">Test #3</a></div>
<div class="category-wrapper"><a href="#">Test #4</a></div>

However, I am not able to make it work.