Cambiar class por otra

[manelmanel8]

Buenas a todos,

primero de todo dar las gracias.

Tengo un menu en arbol que cuando un nivel tiene subniveles muestra delante el simbolo + con la classe fa fa-plus-square-o lo que me gustaria que al hacer clic en un nivel con subniveles al desplegar y mostrar los niveles inferiores cambiara el fa fa-plus-square-o por fa fa-minus-square-o. Llevo un buen rato intentado y no lo consigo.

Código Javascript:

<script type="text/javascript">
        $(document).ready(function() {               
            $("#accordion div").click(function() {
                if (false == $(this).next().is(':visible')) {
                    $('#accordion2 ul').slideUp(300);
                    $('a.activo').removeClass('activo');
                    $(this).children('a').addClass('activo');
                }
                $(this).next().slideToggle(300);
                $('a.activo').removeClass('activo');
                $(this).children('a').addClass('activo');
            });
            $('#accordion2 ul:eq(0)').show();
        });
    </script>
 

HTML

Código HTML:

<ul id="accordion">
    <li class="pdlf-15">
        <div><i class="fa fa-plus-square-o" aria-hidden="true"></i> <i class="fa fa-folder fa-lg" aria-hidden="true"></i> <a href="#" class="">Nivel 1</a></div>
        <ul style="display: block;">
            <li class="pdlf-15">
                <div><i class="fa fa-plus-square-o" aria-hidden="true"></i> <i class="fa fa-folder fa-lg" aria-hidden="true"></i> <a href="#" class="activo">Nivel 2</a></div>
                <ul style="display: block;">
                    <li class="pdlf-15"><i class="fa fa-file fa-lg" aria-hidden="true"></i> <a class="enllac" disabled="disabled" href="#">Nivel 3</a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>