Добавление элементов li в IE9 с помощью Javascript

Question

Я пытаюсь показать список опроса по javascript. Вот код:

function ParseSurveys(surveyList) {
        var sideBarSurveyList = document.getElementById('sliding-navigation');

        for (var m = 0; m < surveyList.length; m++) {
            var child = document.createElement("li");
            child.innerHTML += "<li class='sliding-element'><a href='javascript:sendSurvey(" + (m + 1) + ")'>Survey " + surveyList[m].Id + "</a></li>";
            sideBarSurveyList.insertBefore(child, sideBarSurveyList.lastChild);
        }
    }

Отлично работает на Chrome и Firefox, но не на IE9. В Chrome и Firefox список опросов выглядит следующим образом: • Опрос 1 Это то, что я хочу.

Однако на IE9 это выглядит так: • • Опрос 1

Почему IE9 показывает две точки? Могу ли я иметь простое решение для этого? Я не хочу писать две версии Javascript для IE9 и любых других браузеров. :)

Спасибо! Ashley

Answer 1

Потому что вы создаете LI дважды;один раз с createElement и один раз во внутреннем html.

Answer 2

Возможно, вы не собираетесь вкладывать два <li> с? Попробуйте пропустить теги <li> в своем назначении innerHTML:

function ParseSurveys(surveyList) {
    var sideBarSurveyList = document.getElementById('sliding-navigation');

    for (var m = 0; m < surveyList.length; m++) {
        var child = document.createElement("li");
        child.className = 'sliding-element';
        child.innerHTML += "<a href='javascript:sendSurvey(" + (m + 1) + ")'>Survey " + surveyList[m].Id + "</a>";
        sideBarSurveyList.insertBefore(child, sideBarSurveyList.lastChild);
    }
}