HTML Editor

Step1: Include JS / CSS files required to have this feature. Make sure you include JS files after jQuery JS inclusion.

<script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.9.11/tinymce.min.js"></script>

Step2:

To have html editor in edit mode, add following properties with desired column:

$col["edittype"] = "textarea"; 
$col["formatter"] = "html";
$col["editoptions"]["dataInit"] = "function(el){ setTimeout(function(){ link_tinymce(el); },200); }";

Add following JS callback function that will connect html editor with your textarea:

<script type="text/javascript">
function link_tinymce(el)
{
    // remove nbsp; from start of textarea
    if(el.previousSibling) el.parentNode.removeChild(el.previousSibling);
    $(el).parent().css('padding-left','6px');

    // connect tinymce, for options visit http://www.tinymce.com/wiki.php
    try {
    tinymce.remove("textarea#"+jQuery(el).attr('id'));
    } catch(ex) {}

    tinymce.init({
        selector: "textarea#"+jQuery(el).attr('id'),
        menubar: false,
        forced_root_block : "", 
        force_br_newlines : true, 
        force_p_newlines : false,
        plugins: [
            "advlist autolink lists link image charmap print preview anchor",
            "searchreplace visualblocks code fullscreen",
            "insertdatetime media table contextmenu paste"
        ],
        toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
    });

    // fix to focus typing
    jQuery(document).unbind('keypress').unbind('keydown');

    // bind onchange with textarea
    var ed = tinymce.activeEditor;
    ed.on('change', function (e) {
        jQuery(el).val(ed.getBody().innerHTML);
    });

}
</script>