javascript - 单击时图像边框发生变化

Question

我在同一个 div id="palettes"中有 5 个图像，我希望所有图像都有 3px 纯灰色边框，单击的图像变为黑色。

代码有效，但是当我单击 div 内的这 5 个图像中的任何一个时，javascript 会向页面中的所有图像添加 3px 纯灰色，而不仅仅是在我想要的 div 中。如何在代码中指定这一点？

    $('#palettes img').click(function () {
        $('img').not($(this)).css({'border':'3px solid grey'});
        $(this).css({'border':'3px solid black'});
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="palettes">
    	<a href="javascript:;"><img style="border: 3px solid grey;" src="palette1.jpg"/></a>
    	<a href="javascript:;"><img style="border: 3px solid grey;" src="palette2.jpg"/></a>
    	<a href="javascript:;"><img style="border: 3px solid grey;" src="palette3.jpg"/></a>
    	<a href="javascript:;"><img style="border: 3px solid grey;" src="palette4.jpg"/></a>
    	<a href="javascript:;"><img style="border: 3px solid grey;" src="palette5.jpg"/></a>
    </div>

Answer 1

呸，我刚刚修好了。抱歉。

$('#palettes img').click(function () {
    $('#palettes img').not($(this)).css({'border':'3px solid grey'});
    $(this).css({'border':'3px solid black'});
});