點擊一個div - 改變三個顏色？

Question

當我點擊一個div我希望前後的div也改變顏色。該代碼現在完美工作，但只會改變點擊div的顏色。我真的很習慣使用jQuery，所以我很感激任何幫助。任何人都可以幫忙嗎？

function generateDivs(amount) { 
    container.empty(); 
    for (var i = 0; i < amount; i++) { 
    var div = $('<div>'); 
    div.addClass('box'); 
    container.append(div); 
    } 
} 

var container = $('#boxes'); 

$("#addSquareBtn").click(function() { 
    var nmbrSquare = $("#nmbrSquare").val(); 
    generateDivs(nmbrSquare) 
}); 

generateDivs(1); 

$(function() { 
    $('#boxes').click(function(event){ 
    $(event.target).css('background-color', 'plum'); 

    }); 
}); 

Answer 1

使用prev()和next()象下面這樣： -

$(function() { 
    $('#boxes').click(function(event){ 
     $(event.target).css('background-color', 'plum'); 
     $(this).prev().css('background-color', 'plum'); 
     $(this).next().css('background-color', 'plum'); 
    }); 
}); 

您可以使用Event Delegation太： -

$(function() { 
    $(document).on('click','#boxes',function(){ 
    $(this).css('background-color', 'plum'); 
    $(this).prev().css('background-color', 'plum'); 
    $(this).next().css('background-color', 'plum'); 
    }); 
});