jQuery如何将每个.content-cont内的.media-cont移动到最近的.middle前

• 选取.media-cont时使用了全局选择器$('.media-cont')，会一次性匹配页面中所有的媒体容器，而非当前遍历的.content-cont内的对应元素
• closest()方法的作用是向上查找元素的祖先节点，而.middle是当前.content-cont的后代元素，用该方法无法正确匹配当前容器内的目标，只会返回全局第一个.middle元素，因此所有媒体容器都会被插到第一个目标位置

可以直接合并两次遍历逻辑，减少DOM操作开销：

$('.content-cont').each(function() {
  const $currentContainer = $(this);
  // 给当前容器内的中间p标签加middle类
  const $pList = $currentContainer.find('p');
  const midIndex = Math.floor($pList.length / 2);
  $pList.eq(midIndex).addClass('middle');
  // 移动当前容器内的media-cont到对应middle元素之前
  const $media = $currentContainer.find('.media-cont');
  const $target = $currentContainer.find('.middle');
  $media.insertBefore($target);
});

内容的提问来源于stack exchange，提问作者jmcgrother