jQuery each iteration: every gallery element should have title!

Question

hey guys, simple and annoying question for you, but i need the answer rather quick and i couldn't find a solution.

$('.gallery-item .gallery-icon a').each(function(){
        $('.gallery-caption').prepend("<span class='imgtitle'>"+$(this).attr("title")+"</span>")
    });

every gallery-item has a gallery-caption underneath it. i'm iterating through every gallery-icon and find the title of the link. i want to prepend the title to every gallery-item-caption.

Right now, every image-caption get ALL image-titles prepended. I just want to prepend the title of the current image.

?

Answer 1

You're getting all the titles prepended on all the captions because of this:

$('.gallery-caption').prepend(...

This is actually telling jQuery "prepend the following to all elements of class gallery-caption"

EDIT: Assuming that the link is a sibling of the caption, something like this should work:

$(this).parent().children('.gallery-caption').prepend(...

Answer 2

Now you're prepending all elements that match .gallery-caption condition. You need to specify what element to prepend - like if you need to prepend parent - use .parent()

$('.gallery-item .gallery-icon a').each(function(){
        $(this).parent().prepend("<span class='imgtitle'>"+$(this).attr("title")+"</span>")
    });

or other traversing methods.