单击列表组中的元素

Question

所以，我创建了一个bootstrap group-list来列出来自mysql'mail'表的消息。当电子邮件是新的时，该框为蓝色，当我点击它时，它变为灰色This is the group-list

所以现在，我想点击一个未读并被阅读的框。问题就在于：尽管我会点击哪个框，但只有第一个框会被标记为已读。我认为“this”保留了列表中第一个对象的元素。那么，我该如何选择将哪些消息标记为已读？ 这是EmailsReader.java的doGet方法：

    String rec=(String)session.getAttribute("uname");
            ps =con.prepareStatement("select * from email where receiver=? and new=1");
            ps.setString(1, rec);
            rs =ps.executeQuery();

            ps2 =con.prepareStatement("select * from email where receiver=? and new=0");
            ps2.setString(1, rec);
            rs2 =ps2.executeQuery();

            result = "";
            boolean flag1 = rs.next();
            boolean flag2= rs2.next();
            if(!flag1 && !flag2){
                result += "<div class='alert-float' style='position: absolute; top: 0; left: 130px; right: 30px; z-index: 9999;width: 65%'>"
                        +"<div class='alert alert-warning' role='alert'>"  
                        +" <button type='button' class='close' data-dismiss='alert'>x</button>"  
                        +"<strong>Ohh nooo!</strong> Try not to feel lonely cause you have no emails.. :("
                        +"</div>"
                        +"</div>";
            }
            else{
                result += "<div class='list-group' id='emailList'>";
                while (flag1) {             //list of unread email

                    sender=rs.getString("sender");
                    theme=rs.getString("theme");
                    message=rs.getString("message");
                    result += "<a href='#' class='list-group-item list-group-item-action active' onclick='makeInactive(this)'>"
                            + "<h5 id='send' class='list-group-item-heading'>" + sender+ "</h5>"
                            + "<button id='trash' type='submit' onclick='deleteEmail(this)'>"
                            + "<span id='trash' class='glyphicon glyphicon-trash'></span>"
                            + "</button>";
                    result += "<h6 id='th' class='list-group-item-heading'>" + theme+ "</h6>" 
                            + "<p id='msg' class='list-group-item-text'>" + message+ "</p>"
                            + "</a>";

                    flag1 = rs.next();
                }

                while (flag2) {            //list of read email

                    result += "<a href='#' class='list-group-item list-group-item-action'>"
                            + "<h5 id='send' class='list-group-item-heading'>" + rs2.getString("sender")+ "</h5>"
                            + "<button id='trash' type='submit' onclick='deleteEmail(this)'>"
                            + "<span id='trash' class='glyphicon glyphicon-trash'></span>"
                            + "</button>";
                    result += "<h6 id='th' class='list-group-item-heading'>" + rs2.getString("theme")+ "</h6>" 
                            + "<p id='msg' class='list-group-item-text'>" + rs2.getString("message")+ "</p>"
                            + "</a>";

                    flag2 = rs2.next();
                }
                result += "</div>";

            }
        }

这就是EmailReader.java doPost方法：

String sender = request.getParameter("sender");
    String theme = request.getParameter("theme");
    String message = request.getParameter("message");

     Connection con=null;   
     try{

        con=DBConnection.getCon();
        PreparedStatement ps = con.prepareStatement("update email set new=0 where sender=? AND theme=? AND message=?"); 
        ps.setString(1, sender);
        ps.setString(2, theme);
        ps.setString(3, message);
        ps.executeUpdate();     

    } catch (Exception e) {
        e.printStackTrace();
    }

Javascript和ajax代码

    var j = jQuery.noConflict();
function emailRead() {
j.ajax({
    type : 'GET',
    url : '../emailReader',
    success : function(data) {
        j("#emailList").html(data);
    }
}); 
}emailRead();
function makeInactive(attr) {
var sender = document.getElementById("send").innerHTML;
var theme = document.getElementById("th").innerHTML;
var message = document.getElementById("msg").innerHTML;
j.ajax({
    type : 'POST',
    url : '../emailReader',
    data : {
        "sender" : sender,
        "theme" : theme,
        "message" : message
    },
    success : function(data) {
        j.ajax({
            type : 'GET',
            url : '../emailReader',
            success : function(data) {
                j("#emailList").html(data);
            }
        });
    }
});
}

所以，我想修复的函数是makeInactive（this）。我明白问题在于框的制作。我该如何解决这个问题？