Loading content from a local text file into a scrolling ticker

I am trying to load the contents of a text file (will be in the same folder as the HTML), and have that populate a scrolling ticker (the ticker is based on an un-ordered list).

The page is a part of a splash page on an web-app so we can't go in and update the code often. The desire is to have the info in a txt file that we can replace when we want the content of the ticker to change.

I have been able to populate the information from the txt file into the HTML (it shows outside the ticker), but when I try to reference it in the for the ticker, it does not appear.

Also, for displaying the info in the txt file, it works in Internet Explorer but not chrome.

I originally had XML, but again that worked for Internet Explorer but not Chrome.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<meta http-equiv="X-UA-Compatible" content="IE=11" />

    <head><title>
    Home
</title><meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1" /><meta name="CODE_LANGUAGE" content="C#" /><meta name="vs_defaultClientScript" /><meta name="vs_targetSchema" /><meta http-equiv="Content-Type" content="text/xml; charset=utf-8" /><link href="../App_Themes/Insight/Insight.css" type="text/css" rel="stylesheet" /><link href="../App_Themes/Insight/jquery-ui-1.8.2.custom.css" type="text/css" rel="stylesheet" />

<script type="text/javascript" src="javascript/jquery.min.js"></script>
<script type="text/javascript" src="javascript/jquery.easing.min.js"></script>
<script type="text/javascript" src="javascript/jquery.easy-ticker.js"></script>


<style>

/* ticker style */ 

.vticker {
    font-family: Arial, sans-serif;
    border: 1px solid #466368;
    margin: 10px 0;
    max-width: 80%;
    font-style: italic;
    position: relative;
    padding: 0 0 0 70px;
    box-shadow: 0 2px 5px -3px #000;
    border-radius: 6px;
    background-color: white;
}
.vticker:before {
    content: "Did you know?";
    display: inline-block;
    height: 100%;
    font-style: normal;
    background: linear-gradient(to bottom, rgba(1,4,45,1) 0%,rgba(0,72,148,1) 52%,rgba(59,150,203,1) 76%,rgba(155,185,195,1) 100%);
    padding: 10px;
    color: #fff;
    font-weight: bold;
    position: absolute;
    top: 0;
    left: 0;
}
.vticker:after {
    content: '';
    display: block;
    top: 0;
    background: linear-gradient(#FFF, rgba(100, 100, 100, 0));
    height: 20px;
}
.vticker ul li {
    list-style: none;
    padding: 10px 30px;
    margin-left: 40px;
    font-size: 14px;
    }

.et-run{
    background: red;
}

li {
font-size: 15px;
}

ul {
margin-top: 2px;
margin-bottom: 2px;
}


</style>


</head>

<body>

<script type="text/javascript">
$(document).ready(function(){

jQuery.get("didYouKnow.txt", undefined, function(data) {
    //alert(data);

document.getElementById("didYouKnow").innerHTML = data;

}, "html").done(function() {
//    alert("second success");
}).fail(function(jqXHR, textStatus) {
//    alert(textStatus);
}).always(function() {
//    alert("finished");
});


// here's the ticker information //
    var dd = $('.vticker').easyTicker({
        direction: 'up',
        easing: 'easeInBack',
        speed: 'slow',
        interval: 4500,
        height: 'auto',
        visible: 1,
        mousePause: 1,
        controls: {
            up: '.up',
            down: '.down',
            toggle: '.toggle',
            stopText: 'Stop !!!'
        }
    }).data('easyTicker');

    cc = 1;
    $('.aa').click(function(){
        $('.vticker ul').append('<li>' + cc + ' Triangles can be made easily using CSS also without any images. This trick requires only div tags and some</li>');
        cc++;
    });

    $('.vis').click(function(){
        dd.options['visible'] = 3;

    });

    $('.visall').click(function(){
        dd.stop();
        dd.options['visible'] = 0 ;
        dd.start();
    });

});
</script>


<div id="didYouKnow"></div>

<center>

<div class="vticker">
<!-- THIS IS NOT WORKING FROM HERE.....-->   
<ul>
<div id="didYouKnow"></div>
</ul>
<!-- .... TO HERE--> 


</div>

</center>

</div>


    </body>
</html>

The information in didYouKnow.txt is here:

<ul>
<li>You can check the status of an eB document or tag workflow by clicking on the "Workorder" section on your tag or document request.</li>
<li>You can download all documents from your search results. See <a href="http://ebassets.network.lan/eBDSPRD/eB%20Help/eB%20Help__53.html" target="_blank">Get All Files</a> for more information.</li>
<li>Predictive text boxes in eB must contain exact matches from eB. You cannot type a few letters and not select one of the items in the drop down list. See <a href="http://ebassets.network.lan/eBDSPRD/eB%20Help/eB%20Help__17.html" target="_blank">Using More Options and Quick Search</a> for more information.</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
</ul>

Does anyone know what I could do in this situation to make it work?

Thanks.