Как добавить div по id, используя jquery

Question

Я пытаюсь сделать бесконечную прокрутку с кучей товаров. Я хотел бы добавить div с идентификатором продуктов, когда я окажусь ближе к низу страницы. Я пытаюсь это сделать, но это не сработает.

 $(window).scroll(function() {
  if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) {
    $('#container').append(('#products'));
  }
});

, он просто выводит слово «продукты».

в качестве примечания, как я могу сделать так, чтобы идентификатор содержал в нем число. например,

$('#container').append(('#products[i]'));

, где i - возрастающее число.

Answer 1

Разветвленный из @Vilsad PP ... вы все еще добавляете дескриптор элемента, а не содержимое в элементе ... Этот добавляет фактическое содержимое:

$(window).scroll(function() {
    if ($(window).scrollTop() >= $(document).height() - 
    $(window).height() - 10) {
        $('#container').append($('#products').html());
    }
});

$('#products').html() - это содержимое в элементе, но $('#products') - это просто ссылка на элемент

Теперь для добавления по идентификатору вы можете сделать это:

var count = 0;
$(window).scroll(function() {
    if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) {
        var elem = "#products" + count;
        $('#container').append($(elem).html());
        count++;
    }
});

Что это делает, это принимает переменную с строка, которая соответствует фактическому элементу, и если строка является допустимым селектором, например: $("#products0"), то она вернет true. Очень легально.

Answer 2

попробуйте следующее

$(window).scroll(function() {
   if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) {
      $('#container').append($('#products'));
   }
});

вы, где просто добавляете текст вместо фактического элемента.