JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
    <body>
        <div id="test1">Test 1</div><a href="#run-test1">Run failing test</a><br />
        <div id="test2">Test 2</div><a href="#run-test2">Run working test</a>
        <div id="test3">Test 3</div><a href="#run-test3">Run same failing test, but with fadeIn</a><br />
    </body>
</html>

JavaScript

jQuery(function($) {
    $("a[href=#run-test1]").click(function(e) {
        var div = $(document.createElement("div")).hide().text("Here comes the text").slideDown();
        $("#test1").after(div);
        e.preventDefault();
    });
    $("a[href=#run-test2]").click(function(e) {
        var div = $(document.createElement("div")).hide().text("Here comes the text");
        $("#test2").after(div);
        div.slideDown();
        e.preventDefault();
    });
    $("a[href=#run-test3]").click(function(e) {
        var div = $(document.createElement("div")).hide().text("It works!").fadeIn();
        $("#test3").after(div);
        e.preventDefault();
    });
});