Separando responsabilidades

<ul>
    <li class="invitado">
        Nombre <span class="nombre">Diego</span>,
        edad <span class="edad">23</span>
    </li>
    <li class="invitado">
        Nombre <span class="nombre">Daniel</span>,
        edad <span class="edad">42</span>
    </li>
    <li class="invitado">
        Nombre <span class="nombre">Marcos</span>,
        edad <span class="edad">27</span>
    </li>
    <li class="invitado">
        Nombre <span class="nombre">Fabio</span>,
        edad <span class="edad">18</span>
    </li>

    Total de las edades: <span class="total"></span>
</ul>

<script>

    function totalEdades(class1, class2, class3) {
        var item = document.querySelectorAll(class1);
        var edades = [], edadTotal = 0;

        for (var i = 0; i < item.length; i++) {
            edades[i] = parseInt(item[i].querySelector(class2).textContent);
            edadTotal += edades[i];
        }

        return document.querySelector(class3).textContent = edadTotal;
    }

    console.log(totalEdades('.invitado', '.edad', '.total'));

</script>