append only to one div
append only to one div
I want to change a description (caption) of image after click on it...
- click(function() {
var title = $(this).attr('title');
$('.description').html('');
$('.description').append(title);
});
and it's working but it's adding the same description for all galleries in all my posts, it should change description only in this post.
Another explanation of my problem:
In each post I have a gallery with 5 images (4 thumbs). If I click on first thumb I change main image and caption (from title) of that image. After click all captions in each post are changed on the same as should be only in first post.
Full code:
- $(function() {
$('.post > .post-body').each(function() {
var ii = 0;
$('img', this).each(function() {
if (this.offsetWidth > 100 && $(this).attr('src')) {
ii++;
}
});
if (ii > 2) {
var ul = $('<ul class="galleria"></ul>').prependTo(this);
var im = null;
$('img', this).each(function() {
if (this.offsetWidth > 100 && $(this).attr('src')) {
var li = $('<li></li>').appendTo(ul);
var i = $('<img title="' + $(this).attr('title') + '" src="' + $(this).attr('src') + '">').appendTo(li).
click(function() {
$(im).attr('src', i.attr('src'));
var title = $(this).attr('title');
$('.description').html('');
$('.description').append(title);
});
if (!im) {
im = $('<img src="' + $(this).attr('src') + '" class="main">').insertBefore(ul);
}
$(this).remove();
}
});
$('<div class="clear"></div>').insertAfter(ul);
}
});
});