JSFiddle - React, Tailwind, and code Playground

HTML

<div><button id="javascript">Вставить 1000 div'ов без jQuery</button> : <span id="javascript-result">---</span></div>
<div><button id="jquery">Вставить 1000 div'ов с jQuery</button> : <span id="jquery-result">---</span></div>
<div id="container"></div>

CSS

div {
  margin: 10px 0;
}

JavaScript

var button1 = document.getElementById("javascript"),
    button2 = document.getElementById("jquery"),
    button1result = document.getElementById("javascript-result"),
    button2result = document.getElementById("jquery-result"),
    container = document.getElementById("container");
var $container = $(container);



button1.onclick = function() {
  var divs = createDivs(1000);

  button1result.innerHTML = benchmark(function() {
    for (var i = 0; i < divs.length; i++) {
      container.appendChild(divs[i]);
    }
  });

  container.innerHTML = "";
};

button2.onclick = function() {
  var divs = createDivs(1000);
  var item = null
  button2result.innerHTML = benchmark(function() {
      for (item in divs) {
    	$container.html(divs[item]);
      }
  });

  container.innerHTML = "";
};



function createDivs(length) {
  var divs = [];

  for (var i = 0; i < length; i++) {
    divs.push(document.createElement("div"));
  }

  return divs;
}

function benchmark(func) {
  var start = performance.now();

  func();

  return (performance.now() - start).toFixed(3) + "ms";
}