Custom message in sInfo using Scroller

I am trying to put a custom message in sInfo as below: <span class="lvllbl"></span>
"sInfo": 'There are a total of TOTAL <span class="lvllbl"></span>(s).',

But the Scroller doesn't seem to put the message. If we remove the Scroller it would work just fine and the message is displayed.
I am using Datatable 1.9.4 and Scroller 1.1.0. But this even doesn't work on the latest version.

Here is the code:

$(document).ready(function() {
                var lvllbl;
                var table = $('#hierlvl2list').dataTable( {
                    "sDom": '<"H"Tf<"clear">><"top"i>t<"F">rS',
                    "bJQueryUI": true,
                    "bServerSide": true,
                    "sScrollX": "100%",
                    "sScrollY": "400px",
                    "bScrollCollapse": true,
                    "bAutoWidth": false,
                    "bProcessing": true,
                    "bDeferRender": true,
                    "sAjaxSource": "${pageContext.request.contextPath}/admin/hierarchy/hier_lvl2_list.html?action=listlvlitems&orgid=${param.orgid}",
                    "fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
                        oSettings.jqXHR = $.ajax( {
                            "url": sSource,
                            "data": aoData,
                            "type": "POST",
                            "dataType": 'json',
                            "success": function(data) {
                                var hasError = fnCheckError(data);
                                if(!hasError) {
                                    lvllbl = data.lvllbl;
                                    fnCallback(data);
                                }
                            }
                        });
                    },
                    "aoColumns": [
                        { "sTitle":"Level Title", "mData": "lvlTitle", "sClass": 'col_header' }
                    ],
                    "oLanguage": {
                        "sInfo": 'There are a total of _TOTAL_ <span class="lvllbl"></span>(s).',
                        "sInfoEmpty": 'There are a total of _TOTAL_ <span class="lvllbl"></span>(s).',
                        "sEmptyTable": 'There are no <span class="lvllbl"></span>(s) to display',
                        "sZeroRecords": 'There are no matching <span class="lvllbl"></span>(s) to display',
                        "sProcessing": 'Please wait - loading <span class="lvllbl"></span> (s) ...'
                    },
                    "fnDrawCallback": function(oSettings) {
                        if(lvllbl) {
                            $('span.lvllbl').html(lvllbl);
                        }
                    },
                    "fnHeaderCallback": function( nHead, aData, iStart, iEnd, aiDisplay ) {
                        nHead.getElementsByTagName('th')[0].innerHTML = '<div class="DataTables_sort_wrapper">'+lvllbl+'<span class="DataTables_sort_icon css_right ui-icon ui-icon-triangle-1-n"></span></div>';
                    },