Search code examples
javascripthtmlemoji

When trying to set an HTML element's content to an Emoji in javascript, it displays strange symbols

I want to have a javascript function that changes the text of an element with the id "emoji" to the laughing emoji.

function changeEmoji() {
    document.getElementById("emoji").textContent = "🤣"
}

but when I use this code the element displays 🤣 instead.

Solution

  • you can add emoji by using their unicode id http://unicode.org/emoji/charts/full-emoji-list.html#1f600

    for smiley laungting it's code 0x1F923

    var emoji = String.fromCodePoint(0x1F923)

    Be careful, String.fromCodePoint() is part of the ES2015 standard.so you can have issue on some old browsers

    var emoji = String.fromCodePoint(0x1F923)
document.getElementById("emoji").textContent = emoji;
    <div id="emoji">
</div>