Total retornando zero | JavaScript: programando na linguagem da web

<!DOCTYPE html>
<html>
    <head>
        <title>Calcular idade</title>
        <meta charset="utf-8">
    </head>
    <body>
        <ul>
            <li class="convidado">
                Nome <span class="nome">Douglas</span>,
                idade <span class="idade">23</span>
            </li>
            <li class="convidado">
                Nome <span class="nome">Daniel</span>,
                idade <span class="idade">42</span>
            </li>
            <li class="convidado">
                Nome <span class="nome">Marcos</span>,
                idade <span class="idade">27</span>
            </li>
            <li class="convidado">
                Nome <span class="nome">Flávio</span>,
                idade <span class="idade">18</span>
            </li>

            Total das idades: <span class="total"></span>
        </ul>
    </body>
    <script>
            function criaListaDeConvidados() {
                var itens = document.querySelector(".convidado");

                var convidados = [];

                for(var i = 0; i < itens.length; i++) {
                    var convidado = {
                        nome: itens[i].querySelector(".nome").textContent,
                        idade: parseInt(itens[i].querySelector(".idade").textContent)
                    };

                    convidados.push(convidado);
                }

                return convidados;
            }

            function calculaTotalDasIdades(convidados) {
                var total = 0;

                for(var i = 0; i < convidados.length; i++) {
                    total += convidados[i].idade;
                }

                return total;
            }

            function exibeTotalDasIdades(total) {
                document.querySelector(".total").textContent = total;
            }

            var convidados = criaListaDeConvidados();
            var totalDasIdades = calculaTotalDasIdades(convidados);
            exibeTotalDasIdades(totalDasIdades);

        </script>
</html>
Usando o código do instrutor o meu valor total tá retornando zero. O que poderia fazer para solucionar esse erro?