Modify the style of the selected single option, but after adding the style, the modified option style still exists, that is, two selected styles appear at the same time. The following is my code. How should you modify it?

<p class="choice">
                            <label>
                                <input type="radio" class="a" name="1"><span class="aFont">aaaaa</span>
                            </label>
                            <label>
                                <input type="radio" class="b" name="1"><span class="bFont">bbbbb</span>
                            </label>
                            <label>
                                <input type="radio" class="c" name="1"><span class="cFont">ccccc</span>
                            </label>
                            <label>
                                <input type="radio" class="d" name="1"><span class="dFont">ddddd</span>
                            </label>
                        </p>
<script>
        $(document).ready(function(){
            $(".choice input[type = 'radio']").on("click",function(){
                if ($(".choice input:checked")){
                    $(this).siblings().css("background","red");
                }
            });
        });
</script>