title: Dynamically loading HTML and CSS data from another page
body: <p>I am trying to dynamically load HTML and CSS data from another page in my website project.</p>
  
  <p>Suppose I have 2 pages. First one is onepage.html and second one is twopage.html. Now I have some HTML and CSS (CSS is in external sheet) data in twopage.html that I would like to feed into onepage.html.</p>
  
  <p>Suppose I have a structure for twopage.html like in the snippet below:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>@import url('http://getbootstrap.com/dist/css/bootstrap.css');
  
  .col-sm-3{
    background-color: green;
    height: 100px;
    color: white;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="container"&gt;
    &lt;div class="row"&gt;
       &lt;div class="col-sm-3"&gt;
         &lt;p&gt;Hello&lt;/p&gt;
       &lt;/div&gt;
       &lt;div class="col-sm-3"&gt;
         &lt;p&gt;Hello&lt;/p&gt;
       &lt;/div&gt;
       &lt;div class="col-sm-3"&gt;
         &lt;p&gt;Hello&lt;/p&gt;
       &lt;/div&gt;
       &lt;div class="col-sm-3"&gt;
         &lt;p&gt;Hello&lt;/p&gt;
       &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Now the data in twopage.html is dynamic, meaning that I add a set of new <code>div</code>s (in case of this example, a <code>.col-sm-3</code>) that replaces the old ones in a <code>row</code> class. This effect is something similar to appending.</p>
  
  <p>I would like to load everything that is inside <code>row</code> class to onepage.html (with accompanying CSS). How could I do that? This is probably a task for JavaScript but I have no idea what is even the starting point here. What methods to use? I program my backend using Node.js and Express.js (if this comes in handy for figuring out a solution).</p>