cannot target .last span's text

My php is this

echo "<li><a href='report_view.php?id=" . $row['id'] . "'>ID:(<span class='id'>" . $row['id'] . "</span>) ".$row['date'] ."- [".$row['domain'] . "]</a> <a class='delete'>delete</a></li>";

will outp开发者_C百科ut something like this:

ID:(1) May 21, 2011, 1:32 pm- [www.website.com... ] delete

When I press delete I want it to take the ID from that li row which is displayed between span tags with class of id

My Jquery does this:

 $('a.delete').click(function () {  
    $(this).parent("li").next("span.id").html()
    alert(this);
    });

keeps alerting nothing, should be alerting 1. What am i doing wrong?

Cheers

You could use HTML5 data-* attributes on the delete link:

echo "<li><a href='report_view.php?id=" . $row['id'] . "'>ID:(<span class='id'>" . $row['id'] . "</span>) ".$row['date'] ."- [".$row['domain'] . "]</a> <a class='delete' data-delete-id='" . $row['id'] . "'>delete</a></li>";

and then:

$('a.delete').click(function () {  
    var id = $(this).data('delete-id');
    alert(id);
});

or if you are using jquery 1.6:

$('a.delete').click(function () {  
    var id = $(this).data('deleteId');
    alert(id);
});

and here's a live demo you may try out.