Question

Here is my JSFIDDLE CLICK HERE

My problem is that I Have classes that are the same that I want to move above a div class. So if your looking at my HTML you will notice that I have the class = catalogItemFooter. I want to move said class before class = catalogThumbnailArea. My issue is, there are multiple classes that share the same class. If you are looking at my fiddle you will notice that it moves both items above the other. I dont want this, I want the name to go above its coresponding catalogThumbnailArea and not add it to all the other ones.

My script so far

    $(".catalogItemFooter").parent().insertBefore("table.catalogThumbnailArea");

I realize that this may be complex, if you need more info please ask. Thank you.

Answer 1

Try this

$("div.catalogItemFooter").each(function() {
    var $this = $(this);
    var $thumb = $this.closest('table').prevAll('table.catalogThumbnailArea')
                                                                        .first();
    $this.insertBefore($thumb);
});

​

I am looping over all the div with the corresponding class and inserting it to the corresponding table.

Check Fiddle