Cómo comparar una entidad html con jQuery

Tengo el siguiente código html:

<h3 id="headerid"><span onclick="expandCollapse('headerid')">&uArr;</span>Header title</h3>

Me gustaría alternar entre la flecha hacia arriba y la flecha hacia abajo cada vez que el usuario hace clic en la etiqueta span.

function expandCollapse(id) {   
    var arrow = $("#"+id+" span").html(); // I have tried with .text() too
    if(arrow == "&dArr;") {     
        $("#"+id+" span").html("&uArr;");               
    } else {        
        $("#"+id+" span").html("&dArr;");               
    }
}

Mi función siempre va por el camino contrario. Si hago un javacript: alerta dearrow variable obtengo la entidad html representada como una flecha. ¿Cómo puedo decirle a jQuery que interprete elarrow variable como una cadena y no como html.

Respuestas a la pregunta(5)

Su respuesta a la pregunta