JSFiddle - React, Tailwind, and code Playground

by SpiceLab

HTML

<p>Klicke auf den Button, um in dem umrahmten Feld den Inhalt zu laden.</p> 
<button id="button">Los!</button>
<div id="test"></div>

CSS

div#test {
  padding:.5rem;
  min-height:1.5rem;
  border:thin solid #abc;
  overflow:hidden;
}
span.test {
  width:245px;
  min-width:55px;
  float:right;
  background-color:#FFFBCB;
  text-align:right;
}

JavaScript

'use strict';  
(function () {
	function init() {
	document.getElementById('button').addEventListener('click',changeHTMLContent);
	} 
	function changeHTMLContent() {
      var content = "<span class='test'><b>foo<\/b>bar<\/span>";
      document.getElementById('test').innerHTML = content;
	} 
  document.addEventListener('DOMContentLoaded',init);
}());