Как добавить элементы HTML внутри $ .each внутри функции .append ()?

Question

Ниже приведен код jQuery для добавления HTML в таблицу.Он возвращает эту ошибку

SyntaxError: ожидаемое выражение, получил '}'

    $('#table').append('<tr><td class="column">'+
          $.each(phone_no, function (idx, elem){
           +'<input class="phone" name="phone[0]" value="'+elem+'" />'
         +})+
        '<a href="'+data['url']+'" target="_blank">'+
        '<span class="fas fa-external-link-alt" style="color:#222;"></span>'+
        '</a></td></tr>');

Как правильно добавить этот HTML внутри $.each в append()?

Если я использую это, то ошибки нет, но поля ввода не отображаются.

$('#table').append('<tr><td class="column">'
+$.each(phone_no, function (idx, elem){'<input class="phone" name="phone[0]" value="'+elem+'" />'
})+
'<a href="'+data['url']+'" target="_blank">'+
'<span class="fas fa-external-link-alt" style="color:#222;"></span></a></td></tr>');

Answer 1

Вы не можете использовать функцию с конкатенацией строк, как это, попробуйте разделить вашу логику следующим образом:

var html = '<tr><td class="column">';
$.each(phone_no, function(idx, elem) {
  html += '<input class="phone" name="phone[0]" value="' + elem + '" />';
});
html += '<a href="' + data['url'] + '" target="_blank">' +
  '<span class="fas fa-external-link-alt" style="color:#222;"></span>' +
  '</a></td></tr>';
$('#table').append(html);