1つのdivを3つの色でクリックしていますか？

Question

1つの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'); 
    }); 
});