关于在表格单元格中用字符串替换UL列表的问题

请你看一下这个演示，让我知道如何替换掉这个 <td> 其中包含一个纯字符串的列表，如 “咖啡&amp；茶&amp；牛奶”

var outt;
$("table td").each(function() {
  if ($(this).find("ul").length > 0) {
    var text = $(this).find("li").text();
    outt += text + "&";
  }
$(this).empty();
$(this).text(outt);
});

table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>
      <ul>
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
      </ul>
    </td>
    <td>Austria</td>
  </tr>
</table>

解决方案：

在我的答案中，我循环浏览ULs而不是tds，这样我就可以很容易地对列表项进行分组。然后我循环浏览列表项，并将它们添加到一个数组中，然后简单地连接它们，替换父项。

$("table td ul").each(function() {
   var outt = [];
   $(this).find("li").each(function(){
    var text = $(this).text();
    outt.push(text);
   });
    $(this).parent().text(outt.join(" & " ));
});

table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>
      <ul>
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
      </ul>
    </td>
    <td>Austria</td>
  </tr>
</table>