如何使用JQuery为数组的每个值生成HTML元素？

Question

Here is my HTML element :

        <li class="comment author-comment">

                <div class="info">
                    <a href="#">Jack Smith</a>
                    <span>3 hours ago</span>
                </div>

                <a class="avatar" href="#">
                    <img src="{{ 
            asset('commentui/images/avatar_author.jpg') }}" width="35" 
             alt="Profile Avatar" title="Jack Smith" />
                </a>

                <p>Value is here</p>

      </li>

Here is my JQuery code :

   $.get('{{ URL::to('comment/retrive') }}',function(data){
    console.log(data);
      $.each(data, function(key, value){
      $('.comment p').html(value.comment);
    });
   });

I need to generate The HTML Element with every value of the data or value.comment. So that it creates a list of the values, But now I am getting only the first one value. Please help.

The data is retriving an object as the image here and I need to print the comment only in list :

Answer 1

Replace

$('.comment p').html(value.comment);

By

$('.comment p').append(value.comment);

Because with .html each loop will override the previous one.

But Append will add your value after the previous.

Answer 2

You have to create a new element for each line, not just update your single element text value :

var rp=$('.comment p');
$.each(data, function(key, value){
  var p = $('<p>');
  rp.append(p);
  p.text(value.comment);
});

Answer 3

尝试附加数据而不是替换数据。