JQuery .append () добавляет только заглавные буквы

Question

Я работаю над приложением-генератором цитат Cordova, где пользователь может добавлять свои собственные цитаты.

У меня есть список цитат по умолчанию, которые хранятся как объект JavaScript для справки.Я тестировал цикл for, чтобы отобразить все мои цитаты в списке, где идея состоит в том, чтобы отображать их в виде кнопок, чтобы пользователь мог нажать на цитату и редактировать текст.

Моя проблема в том, что при использовании .append() для добавления <li> элементов к <ul> в отображаемом HTML отображаются только заглавные буквы и знаки пунктуации.

Есть несколько других странных персонажей, из-за которых кажется, что проблема связана с Unicode, но я не уверен.Я пытался проверить, где кнопка показывает автора цитаты.Я сослался на имя, используя quoteSource[i].name.

Редактировать: я проверил, что мой CSS имеет нужный мне шрифт, объявлен как !important, и у меня нет гарнитуры, которая выглядит как отображаемая.Я попытался добавить код вручную, и он работал как положено.

Некоторый код из моего объекта JS:

var quoteSource=[
    {
        id: 1,
        quote: "Start by doing what's necessary; then do what's possible; and suddenly you are doing the impossible.",
        name:"Francis of Assisi"
    },
    {
        id: 2,
        quote:"Believe you can and you're halfway there.",
        name:"Theodore Roosevelt"
    },
    {
        id: 3,
        quote:"It does not matter how slowly you go as long as you do not stop.",
        name:"Confucius"
    },
    {
        id: 4,
        quote:"Our greatest weakness lies in giving up. The most certain way to succeed is always to try just one more time.",
        name:"Thomas A. Edison"
    },
    {
        id: 5,
        quote:"The will to win, the desire to succeed, the urge to reach your full potential... these are the keys that will unlock the door to personal excellence.",
        name:"Confucius"
    },
    {
        id: 6,
        quote:"Don't watch the clock; do what it does. Keep going.",
        name:"Sam Levenson"
    },
    {
        id: 7,
        quote:"A creative man is motivated by the desire to achieve, not by the desire to beat others.",
        name:"Ayn Rand"
    },
    {
        id: 8,
        quote:"Start where you are. Use what you have. Do what you can.",
        name:"Arthur Ashe"
    },
    {
        id: 9,
        quote:"Ever tried. Ever failed. No matter. Try Again. Fail again. Fail better.",
        name:"Samuel Beckett"
    },
    {
        id: 10,
        quote:"Be yourself; everyone else is already taken.",
        name:"Oscar Wilde"
    }];

Моя функция для отображения списка:

function customQuotes() {
    quoteTitle.innerHTML = "Custom Quotes";
    quoteActivity.style.display = "block";
    addButton.style.display = "block";
    quoteList.html('');
    for(i=0;i<sourceLength;i++) {
        quoteList.append('<li class="item-list-li"><i class="material-icons list-item-icon>edit</i><p class="list-item-text">' + quoteSource[i].name + '</p></li>'); 
    }

}

У меня есть другая функция, которая работает аналогично приведенной выше.который отображает весь объект цитаты на экране, который, кажется, работает нормально.Вот фрагмент этого кода:

function setQuote(a) {
    newQuoteText = quoteSource[a].quote;
    newQuoteGenius = quoteSource[a].name;
    newQuoteId = quoteSource[a].id;
    if ((newQuoteGenius === null) || (newQuoteGenius == "") || (newQuoteGenius == " ")) { newQuoteGenius = "Unknown" }
    quoteContainer.fadeOut(timeAnimationIn, function () {
        quoteContainer.html('');
        quoteContainer.append('<p class="quote">' + newQuoteText + '</p>' + '<p id="name" class="name">' + '-' + newQuoteGenius + '</p>');
        quoteContainer.fadeIn(timeAnimationOut);
    });
}

Я также заметил, что при попытке напечатать символ «редактировать» из значков материалов этот символ не отображается в документе.Кроме того, гарнитура неверна и должна выглядеть как гарнитура в заголовке (см. Прикрепленные изображения).

Вот несколько скриншотов, я обвел два символа, которые заставили меня заподозрить проблему Unicode:

Вот jsfiddle моей проблемы.Чтобы увидеть, как это должно выглядеть, просто закомментируйте вызов customQuotes() в нижней части JS.https://jsfiddle.net/dbzte38m/