Ändern Sie den Inhalt von <span> auf klicken

Question

Ich habe eine <span>, die ich versuche, den Inhalt von auf klicken zu ändern. Ich habe ein paar Tutorials verfolgt, aber ich kann es nicht richtig verstehen, so dass es sich ändern wird. Ich benutze Unicode-Zeichen, also glaube ich, dass ich .html() anstelle von .text() verwenden muss, aber ich könnte falsch liegen. Warum sollte das nicht funktionieren? Hier

ist die Quelle, die ich arbeite mit

$(document).ready(function() { 
 
    $(".dropdownheader").click(function() { 
 
    $("#childList").toggle("slow"); 
 
    if ($("#droparrow").html() == '▸') { 
 
     $("#droparrow").html('▾'); 
 
    } else { 
 
     $("#droparrow").html('▸'); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="dropdownheader">Expected Outcomes of a Corporate Course <span id="droparrow">&dtrif;</span></div> 
 
<div id="childList"> 
 
    <ul> 
 
    <li>A better relationship with your coworkers.</li> 
 
    <li>A High Trust and open enivornment.</li> 
 
    <li>A safe and fun environment to work in.</li> 
 
    </ul> 
 
</div>

Answer 1

Es weil dieser Prüfung ist:

if ($("#droparrow").html() == '▸') 

immer falsch ausgewertet. Ein besserer Weg dazu könnte darin bestehen, ein data-expanded Attribut auf Ihrem Element zu speichern und damit festzulegen, ob umgeschaltet werden soll - Sie müssen daran denken, das Datenelement bei jedem Klick zu aktualisieren.

$(".dropdownheader").click(function() { 
 
    $("#childList").toggle("slow"); 
 
    if($("#droparrow").data("expanded") == "1") { 
 
     $("#droparrow").data("expanded","0").html('▾'); 
 
    } else { 
 
     $("#droparrow").data("expanded","1").html('▸'); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="dropdownheader">Expected Outcomes of a Corporate Course <span id="droparrow" data-expanded="1">&rtrif;</span></div> 
 
    <div id="childList"> 
 
     <ul> 
 
      <li>A better relationship with your coworkers.</li> 
 
      <li>A High Trust and open enivornment.</li> 
 
      <li>A safe and fun environment to work in.</li> 
 
     </ul> 
 
    </div>