I have three of li:
<li id="234-sg-235"><div><a></a></li>
<li><div><a></a></li>
<li>
<div>
<a>Don't show again</a>
</div>
</li>
it seems something like:
while the user presses don't show again
, I want to remove these li-s after 3 seconds.
so I need only the code which removes them.
I tried three things:
1)
$(this).parent('div').parent('li').fadeOut(3000);
$(this).parent('div').parent('li').prev().fadeOut(3000);
$(this).parent('div').parent('li').prev().prev().fadeOut(3000);
2)
var notificationId = $(this).parent('div').parent('li').prev().prev().attr("id");
$(this).parent('div').parent('li').fadeOut(3000);
$("#" + notificationId).next().fadeOut(3000);
$("#" + notificationId).fadeOut(3000);
3)
$(this).parent('div').parent('li').fadeOut(3000, function () {
$(this).parent('div').parent('li').remove();
});
$(this).parent('div').parent('li').prev().fadeOut(3000, function () {
$(this).parent('div').parent('li').prev().remove();
});
$(this).parent('div').parent('li').prev().prev().fadeOut(3000, function () {
$(this).parent('div').parent('li').prev().prev().remove();
});
but the result is (the first li was deleted and the others got: display:none
):
<li style="display: none"><div><a></a></li>
<li style="display: none">
<div>
<a>Don't show again</a>
</div>
</li>
why these li-s were not deleted? why the first li is only deleted?
any help appreciated!