how to display none for other appended in jquery click checkbox

Question

I have many checkbox in my page, now conditionals all id if checked each with switch case

But it does not work properly, when I select the check box, the values in the checkbox ID (the ID value is the identifier of each row in the database) are compared by the switch and it gives a different message for each value, so far Works fine, but selects another value when another checkbox is selected (Please select multiple checkboxes to display different messages) The previously created div will not be hidden, so it will continue until the end. And paste each message in a new row

To see the problem, select all the checkboxes and then uncheck the middle checkbox

$(document).ready(function(){
$('input[name="id[]"]').click(function()
            {

                var url = $('input[name="id[]"]') // get all checkboxes
                    .filter(':checked')  // get only checked
                    .toArray()  // convert jQuery collection to array
                    .reduce(function(acc, val) {
                        acc.push(val.value);
                        return acc;
                    }, [])
                var groupId = $('input[name="id[]"]') // get all checkboxes
                    .filter(':checked')  // get only checked
                    .toArray()  // convert jQuery collection to array
                    .reduce(function(acc1, val1) {
                        acc1.push(val1.id);
                        return acc1;
                    }, [])

                var total = 0;
                $('input:checkbox:checked').each(function(){
                    total += isNaN(parseInt($(this).attr('id'))) ? 0 : parseInt($(this).attr('id'));
                });

                switch (true)
                {
                    case groupId == 0:
                        break;
                    case groupId == 1:
                        no_command_alert()
                        break;
                    case total == 1:
                        multiple_alert()
                        break;
                }

                function multiple_alert(){
                    $('.btn-container').append(
                        '<div class="btn-list row justify-content-center" style="display: none">'
                        +'<div class="col-12 text-center">'
                        +'<div class="alert alert-primary text-center">'
                        +'<h5>warning</h5>'
                        +'<hr>'
                        +'<p>different is true</p>'
                        +'</div>'
                        +'</div>'
                        +'</div>'
                    );
                    $('.btn-list').fadeIn('fast');
                }

                function no_command_alert(){
                    $('.btn-container').append(
                        '<div class="btn-list row justify-content-center " style="display: none">'
                        +'<div class="col-12 text-center">'
                        +'<div class="alert alert-primary text-center">'
                        +'<h5>warning</h5>'
                        +'<hr>'
                        +'<p>you cant change this</p>'
                        +'</div>'
                        +'</div>'
                        +'</div>'
                    );
                    $('.btn-list').fadeIn('fast');
                }
            });
            });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form>
    <input type="checkbox" id="0" name="id[]" value="1">
    <input type="checkbox" id="0" name="id[]" value="2">
    <input type="checkbox" id="1" name="id[]" value="4">
</form>

<div class="btn-container  justify-content-center "></div>