JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<div id="container">
  <div id="child"></div>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>
  TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT<br>TEXT
</div>

<div id="btn">ADD TEXT ROW</div>

CSS

html, body {
  height: 100%;
}

body {
  margin: 0;
  font-family: sans-serif;
}

#container {
  position: relative;
  width: 80%;
  height: 80%;
  overflow-y: auto;
  background-color: lightgrey;
}

#child {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  width: 50px;
  background-color: lightcoral;
}

#btn {
  display: inline-block;
  margin-top: 20px;
  padding: 5px;
  cursor: pointer;
  background-color: white;
  border: 1px solid black;
}

JavaScript

$(document).ready(function() {
	
  var container = document.getElementById("container");
  $container = $("#container");
	$child = $("#child");
  $btn = $("#btn");
  
  setHeight();

	$btn.on('click', function() {
  	$container.append("<br>NEW LINE");
  });
  
  function setHeight() {
  	var container_height = container.scrollHeight;
    $child.css({"height":container_height});
  }
  
  var observeDOM = (function() {
		var MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
		var eventListenerSupported = window.addEventListener;

	return function(obj, callback) {
		if ( MutationObserver ) {
			var obs = new MutationObserver(function(mutations, observer) {
				if( mutations[0].addedNodes.length || mutations[0].removedNodes.length )
					callback();
        });
        obs.observe( obj, { childList:true, subtree:true });
      }
      else if ( eventListenerSupported ) {
        obj.addEventListener('DOMNodeInserted', callback, false);
        obj.addEventListener('DOMNodeRemoved', callback, false);
      }
    }
	})();
  
	observeDOM(document.getElementById('container'), function() { 
		setHeight();
  });
});