JSFiddle - React, Tailwind, and code Playground

HTML

<textarea name="mensagem" cols="90" rows="10" placeholder="digite o texto ou cole HTML"></textarea>
<div></div>

CSS

img {
	margin: 10px;
	transition: transform 0.4s;
	cursor: pointer;
}
img:hover {
	transform: scale(1.5);
}

JavaScript

function addMe(emoticon, target) {
    return function() {
        target.value += emoticon;
    }
}

window.onload = function() {
    var url = ['http://app.e-orkut.com/assets/images/emoticons/', '.gif'];
    var emoticons = ['[:(]', '[8)]', '[>:(]', '[:)]', '[;)]', '[:D]', '[:o]', '[:p]', '[:)]'];
    var textarea = document.querySelector('textarea');
    var emoticonsElement = document.getElementsByTagName("div")[0];
    for (var i = 0; i < emoticons.length; i++) {
        var img = document.createElement('img');
        img.src = url.join(i + 1);
        emoticonsElement.appendChild(img);
        img.addEventListener('click', addMe(emoticons[i], textarea));
    }
}