JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div id="myD">

</div>

<a id="genul" href="#">Создать список</a>

JavaScript

$("#genul").click(function() {
  $('#myD').append('<ul><li>Это наш текст, который при определенных условиях отобразится в блоке</li></ul><br /><a class="genli" href="#">Добавить элемент список - li</a>');
  $("#genul").remove();
});
$("#myD").on("click", ".genli",function(e) {
 $('#myD > ul').append('<li>Это наш текст, который при определенных условиях отобразится в элементи li</li>');
});

      var target = document.querySelector("#myD > ul");
         var observer = new MutationObserver(function(mutations) { 
                      mutations.forEach(function(mutation) {
                               alert("Сработало!");
                           });
                   });
                var config = { attributes: true, childList: true, characterData: true };

observer.observe(target, config);