JSFiddle - React, Tailwind, and code Playground

by Hidayat Rifan

HTML

<div class="emoWrap" id='comments'> :) :( =( :waaa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :yaya: :&#39;( T_T :&#92; :p B) :Q :Ozz 7:( &#92;o/ &#92;m/ **p &lt;3 0:) ^o^ :-a 7:O *fck* xV x@ X@ ~x( &lt;:) &lt;=) (-.-,) *=p =p* &#39;&#39;J :W :bye: :i-am-here: :cendol: :rolled: *bang* :drummer: :guitarist: :vocalist:</div>

JavaScript

/*!
 * Simple regex experiment to create an automatic emoticons by Taufik Nurrohman
 * Visit: http://www.dte.web.id
 * Edited by : Rifan Hidayat
 * Visit: http://obesitystrike.blogspot.com
 */


function imut(b) {
    var e = document.getElementById(b) ? document.getElementById(b) : "",
        d = " <img src='http://obesity-project.googlecode.com/svn/trunk/host/emotion/",
        h = "' class='emo'></img>",
        e = "" !== e ? e.innerHTML : e,
        e = e.replace(/\s:\)/g, d + "smile.gif' title=':)" + h).replace(/\s;\)/g, d + "wink.gif' title=';)" + h).replace(/\s:D/g, d + "haha.gif' title=':D" + h).replace(/\s=D/g, d + "hihi.gif' title='=D" + h).replace(/\s\^:D/g, d + "abovemehaha.gif' title='^:D" + h).replace(/\s\^\_?\^/g, d + "senyum-tulus.gif' title='^_^" + h).replace(/\s:\(/g, d + "sad.gif' title=':(" + h).replace(/\s=\(/g, d + "sad-2.gif' title='=(" + h).replace(/\s@@,/g, d + "rolleyes.gif' title='@@," + h).replace(/\s:yaya:/ig, d + "yaya.gif' title=':yaya:" + h).replace(/\s:s/ig, d + "sullen.gif' title=':s" + h).replace(/\s:(\\|\/)/ig, d + "memble.gif' title=':&#92;" + h).replace(/\s:('|\&\#39\;)\(/g, d + "cry.gif' title=':&#39;(" + h).replace(/\s:waaa:/ig, d + "wa.gif' title=':waaa:" + h).replace(/\sT\_T/ig, d + "tears.gif' title='T_T" + h).replace(/\sB\)/g, d + "cool.gif' title='B)" + h).replace(/\s:Q/g, d + "smoking.gif' title=':Q" + h).replace(/\s\*\*p/ig, d + "crazy.gif' title='**p" + h).replace(/\s7:\(/g, d + "conf.gif' title='7:(" + h).replace(/\s(:|=)p\*/ig, d + "ball2.gif' title='=p*" + h).replace(/\s:p/ig, d + "wee.gif' title=':p" + h).replace(/\s:Oz+/ig, d + "sleep.gif' title=':Ozz" + h).replace(/\s7:O/ig, d + "angry.gif' title='7:O" + h).replace(/\s\\o\//ig, d + "applause.gif' title='&#92;o/" + h).replace(/\s\\m\//ig, d + "metal.gif' title='&#92;m/" + h).replace(/\s(&lt;3|:\*)/g, d + "love.gif' title='&amp;amp;lt;3" + h).replace(/\s0:\)/g, d + "angelgreen.gif' title='0:)" + h).replace(/\s\^o\^/ig, d + "angelwhite.gif' title='^o^" +...