html5 - How can I call <figcaption> with jquery and insert into <a> tag -


i'm trying call content held within element , insert tag can used caption on lightbox.

the html looks like:

<figure class="image">     <img alt="sadasdasd" src="http://i.telegraph.co.uk/multimedia/archive/02580/japan-train_2580841k.jpg" />     <figcaption>adsasdsa</figcaption> </figure> 

the jquery using below:

$('#article-copy img').each( function() {     var $img = $(this),     caption = $("figcaption"),     href = $img.attr('src');     $img.wrap('<a href="' + href + '" class="fresco" data-fresco-group="unique_name" data-fresco-caption="' + caption + '"></a>'); }); 

thank help.

from saying getting img element when clicked, , getting href use. not able reach figcaption because not on img element. sibling element. can using next

$img.next('figcaption').text(); 

but there other functions find might prefer use. can see options in jquery tree traversal api docs. using next() this:

$('#article-copy img').each( function() {     var $img = $(this),     caption = $img.next('figcaption').text(),     href = $img.attr('src');     $img.wrap('<a href="' + href + '" class="fresco" data-fresco-group="unique_name" data-fresco-caption="' + caption + '"></a>'); }); 

Comments