javascript string replace for text to emoticon in php page

Question

Hello I have a joomla site with plugin called rokcomments. This plugin enables livefyre comments on my site. I'm trying to get text to emoticon to work on the livefyre comments but I don't have much javascript experience and not having any luck. I have found the php that loads the livefyre comments and here it is:

elseif ($system == 'livefyre') {
        // livefyre comments
        if ($this->commentpage == false) {
            if (!defined('ROKCOMMENT_COUNT'))
            {
                $headscript = '
                <script type="text/javascript" src="http://zor.livefyre.com/wjs/v1.0/javascripts/CommentCount.js"></script>';
                $document->addCustomTag($headscript);
                define('ROKCOMMENT_COUNT', 1);
            }
            $output = '
                <div class="rk-commentcount{rk-icon}">
                    <span class="livefyre-commentcount"
                      data-lf-site-id="{account}"
                      data-lf-article-id="{post-id}">0 Comments
                    </span> 
                </div>';
        } else {
            $output = "
                <!-- START: Livefyre Embed -->
                <div id='livefyre-comments'></div>
                <script type='text/javascript' src='http://zor.livefyre.com/wjs/v3.0/javascripts/livefyre.js'></script>

                <script type='text/javascript'>
                (function () {
                    var articleId = '{post-id}';
                    fyre.conv.load({}, [{
                        el: 'livefyre-comments',
                        network: 'livefyre.com',
                        siteId: '{account}',
                        articleId: articleId,
                        signed: false,
                        collectionMeta: {
                            articleId: articleId,
                            url: fyre.conv.load.makeCollectionUrl(),

                        }
                    }], function() {});
                }());



                </script>

                <!-- END: Livefyre Embed -->";

I have then created a js file and tried to link it in this page but still getting no luck. Here is what i have in the js file

<script>
function myFunction() {
    var str = document.getElementById('livefyre-comments').innerHTML; 
    var res = str.replace(":)", '<img src="http://website.com/images/emoticons/emoticon_smiley.gif');

    document.getElementById('livefyre-comments').innerHTML = res;
}
</script>

I'm not sure what to do to accomplish this? Any help is greatly appreciated.