Javascript 在移动视图中将子div移动到末尾

我对CSS/JS/HTML的世界非常陌生。我读了一些关于如何重新定位div的帖子，但是它们都包含在同一个父div容器中。在我的场景中，我需要将一个内部div移动到页面的末尾

<div class="container">
    <div class="block-row">
        <div class="col-8">
          <div class="richtext">
             Some Text
          </div>

          <ul class="list clearfix">
            <li class="list-item">
              List item 1 text
            </li>
            <li class="list-item">
              List item 2 text
            </li>
          </ul>  

          <div class="richtext">
            <p>Some text that needs to appear at the bottom of the page in mobile view only</p>    
          </div>  
        </div>

        <div class="col-70 sidebar">
            <div class="info">     
              <h2 class="info-head">
                <span>Text</span> text
              </h2>
            </div>            
        </div>
    </div>
</div>

一些文本


清单项目1案文


清单项目2案文


一些只需在移动视图中显示在页面底部的文本

文本

我需要在页面的移动视图中，将出现在

元素之后的带有类richtext的div移动到带有类边栏的div之后

<div class="container">
    <div class="block-row">
        <div class="col-8">
          <div class="richtext">
             Some Text
          </div>

          <ul class="list clearfix">
            <li class="list-item">
              List item 1 text
            </li>
            <li class="list-item">
              List item 2 text
            </li>
          </ul>  

          <div class="richtext">
            <p>Some text that needs to appear at the bottom of the page in mobile view only</p>    
          </div>  
        </div>

        <div class="col-70 sidebar">
            <div class="info">     
              <h2 class="info-head">
                <span>Text</span> text
              </h2>
            </div>            
        </div>
    </div>
</div>

CSS或JS是解决这个问题的方法吗？什么是最好的、最优雅的方法

---

谢谢

一种方法是使用jquery的函数

insertBefore（）

if（$（窗口）.width（）>=768）
$（“ul+.richtext”）.insertBefore（“.sidebar”）；
其他的
$（“.sidebar”）.insertBefore（“ul+.richtext”）

一些文本


清单项目1案文


清单项目2案文


一些只需在移动视图中显示在页面底部的文本

文本
为什么要使用
.insertBefore（$（“.sidebar”）
而不是
.insertBefore（.sidebar”）
-您确定指向类是好的吗？另外，为什么只在
上调整大小？够了吗？可能创建一个函数并在需要时调用它会更好。您为什么使用
e.preventDefault（）
在调整大小时您试图阻止什么默认浏览器行为？@RokoC.Buljan Thnx指出。。您可以毫无问题地使用.insertBefore（“.sidebar”）。是的，e.preventDefault（）不是必需的。：）很高兴我能指出一些问题。附言：想象一下你在做一个大项目。您有N个脚本在调整大小时执行昂贵的任务，但明智地使用
窗口.onresize
事件。通过执行
.resize（）
，您将同时触发所有这些even。我重复一遍，您最好使用一个函数，封装您的代码，并像
$（moveRichText）//DOM ready
和
$（window）那样调用它。在（“load resize”，moveRichText）
上，当我运行代码段时，我会看到文本显示两次。您在一个页面上有更多这样的元素吗？如果是的话，你应该提到它-因为为一个元素做一个作业（在这种情况下使用ID通常很有帮助）或为多个元素做一个作业有很大的不同。Hi Roko，页面上有两个带有richtext类的div。如前所述，其中一个需要移到页面末尾。页面上有更多内容，但它们有不同的子元素。