Meu código javascript como este:

$(function(){
    $('input[type="radio"]').click(function(){
        var $radio = $(this);
        var name = $(this).prop("name");

        // if this was previously checked
        if ($radio.data('waschecked') == true)
        {
            $radio.prop('checked', false);
            $radio.data('waschecked', false);
            $('#result-select').text('');
        }
        else{
            $radio.data('waschecked', true);
            $("input[name=\""+name+"\"]:not(:checked)").data('waschecked', false);
            $('#result-select').text(txt);
        }

        var output = [];
        var txt;
        $('input[type="radio"]:checked').each( function() {
                txt = $(this).parent().text();
                output.push(txt);
        });
        $('#result-select').text(output.join(' - '));
    });
});

Demonstração e código completo como este:https://jsfiddle.net/oscar11/m7by6zcw/41/

Eu quero :

Se eu selecionar chelsea, madrid e juve o resultado assim:

Chelsea - Madrid - Juve

Se eu selecionar chelsea e madrid, o resultado será o seguinte:

Chelsea - Madrid

Se eu selecionar chelsea, madrid, juve e milan, o resultado assim:

Chelsea - Madri - Juve - Milão

Portanto, se eu verificar o botão de opção, ele exibirá o texto. Se eu desmarcar o botão de opção, ele não exibirá o texto. Verifico a caixa de combinação, ela exibe o texto. Se eu desmarcar a caixa de combinação, ela não exibirá o texto

Por exemplo, o texto:

Chelsea - Madri - Juve - Milão

Desmarco a Juve, o resultado é o seguinte:

Chelsea - Madri - Milão

No botão de opção, funciona Mas na caixa de seleção, ainda estou confuso

Como eu posso fazer isso?

Atualizar :

O botão de opção pode ser desmarcado

Por exemplo :

Se eu selecionar chelsea, madrid e juve o resultado assim:

Chelsea - Madrid - Juve

Depois desmarco madrid, o resultado é o seguinte:

Chelsea - Juve