Могу ли я использовать .click для задания только одного результата в запросе, который возвращает несколько результатов?

Question

Этот блок кода возвращает несколько результатов, которые затем отображаются пользователю на странице. В тот момент, когда пользователь нажимает на любой кнопки здесь

wrapper.append('<div type="button" class="btn btn-danger mrs decline">' + 'Unfriend' + '</div>'); 

Вместо того, чтобы просто падает один объект, все объекты снизились. Это не то, что я хочу.

Для правильной работы этой функции было бы правильным, если бы вы выглядели следующим образом:

 $('.decline).css('cursor', 'pointer'); 

-

mainQuery.find({ 
      success: function(results) { 
       var friends = []; 
       for (var i = 0; i < results.length; i++) { 
        friends.push({ 
         imageURL: results[i].get('toUser').get('pic'), 
         username: results[i].get('toUser').get('username'), 
         userId: results[i].get('toUser').id, 
         status: results[i].get('status'), 



         // Saves the object so that it can be used below to change the status// 
         fetchedObject: results[i] 


        }); 


       } 
       var select = document.getElementById("FriendsConnected"); 
       $.each(friends, function(i, v) { 
        var opt = v.username; 
        var el = document.createElement("option"); 
        el.textContent = opt; 
        el.value = opt; 
        select.appendChild(el); 
       }) 


       $('#containerFriends').empty(); 
       $('#containerFriendsConnected').empty(); 

       _.each(friends, function(item) { 
        var wrapper = $('<div class="portfolio-item-thumb one-third"></div>'); 
        wrapper.append('<img class="responsive-image friendImgOutline" src="' + item.imageURL + '" />' + '<br>'); 
        wrapper.append('<div class="tag">' + item.username + '</div>'); 
        wrapper.append('<div type="button" class="btn btn-danger mrs decline">' + 'Unfriend' + '</div>'); 

        $('#containerFriends').append(wrapper); 
        //The following lets the user accept or decline a friend request by changing the status the status from Pending to Declined///// 
        $(document).on('click', function() { 
//Note 1//// 
         $(".decline").click(function() { 
          item.fetchedObject.set("status", "Rejected"); 


          item.fetchedObject.save(null, { 
           success: function(results) { 
            console.log("REJECTED"); 

           }, 
           error: function(contact, error) { 
            // The save failed. 
            // error is a Parse.Error with an error code and description. 
            alert("Error: " + error.code + " " + error.message); 
           } 
          }); 


         }); 

Answer 1

Вы должны привяжите обработчик только к определенному элементу, а не ко всем .decline элементам. Удалите $(document).on('click', ...) обработчик, и изменить его на:

wrapper.children('.decline').click(function() { 
    ... 
}); 

Answer 2

Существует ошибка в коде здесь $('.decline).css('cursor', 'pointer'); вы должны добавить ' после имени класса, так он должен выглядеть следующим образом $('.decline').css('cursor', 'pointer');