jQuery, у объекта нет метода innerHtml

Question

Я задал вопрос немного назад и получил несколько полезных советов.Я пытаюсь сделать сортируемый список, который позволяет пользователю добавить URL-адрес YouTube в список.У меня установлено, чтобы он взял идентификатор и поместил его в массив, а затем я хочу, чтобы он использовал следующий javascript для добавления URL-адреса видео и ссылки "cue" в список:

    _videoId = _videoUrl.replace(/^[^v]+v.(.{11}).*/,"$1");
//place the Videoid in an array
_videoList[_videoList.length] = _videoId;
var $new_element = document.createElement('li');
//set the id of the li element to match it's position in the array
var refId = _videoList.length;
$new_element = $('li').attr('id', refId);
var $link = $('a')
.attr('href', _videoUrl)
.innerHtml(_videoUrl)
.data('refId', refId) // add parent li's id for reference in click event
.appendTo( $new_element )
.bind( 'click', function(){
    cue( $link.data('refId') );
    return false; // prevent browser's default click event
});

$new_element.appendTo( container );

Однако этовыдает мне ошибку (в chrome)

Object [object Object] не имеет метода innerHtml

мой HTML выглядит так:

<div id="hostPanel">
        <div id="videoList">
        <ul id="sortable">

        </ul>
        </div>

Любая помощь в получении этого может быть хорошей.

Answer 1

innerHtml - это свойство DOM-элементов, а не метод jQuery-объектов. Вместо этого используйте html () .

---

Edit:

По поводу комментария:

$new_element = $('li').attr('id', refId);

Это не создает новый <li> -элемент, оно берет существующие <li> -элементы внутри документа.

Чтобы создать новый элемент в jQuery, используйте

$new_element = $('<li/>').attr('id', refId);

Здесь то же самое:

var $link = $('a')

... должно быть

var $link = $('<a/>')

Не смешивайте jQuery и Javascript (DOM)

Это путь Javascript (DOM) для создания элемента:

var $new_element = document.createElement('li');

jQuery ожидает разметку для $(), в то время как DOM-метод createElement() ожидает tagName в качестве параметра.