user1216398
user1216398

Reputation: 1960

How do I get a selected list items value from a click event on a span tag?

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

Answers (1)

VisioN
VisioN

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

Related Questions