Reputation: 1960
I have a list of items that I append a delete icon to like so:
$.each(data.files, function() {
$('#listReports').append('<li><a href="#">'+ this + '</a><span class="del" style="float:right;"><i class="icon-remove"></i></span></li>');
});
CSS file:
li span.del {
display: none;
}
li:hover span.del {
display: inline-block;
}
JQuery Code:
$('li').hover(
function() {
$(this).find('span.del').show();
},
function() {
$(this).find('span.del').hide();
}
);
How can I select the list item value if a user clicks the del icon?
Upvotes: 1
Views: 343
Reputation: 145428
Let's assume that you add list items dynamically, and let's also assume that list item value is the text that <a>
tag contains. If so, then the following code should do the job.
$("#listReports").on("click", ".del", function() {
var value = $(this).siblings("a").text();
});
Upvotes: 1