JSFiddle - React, Tailwind, and code Playground

by xonev

HTML

<div id='withDetach' style="background-color: red;">
</div>

<div id='withoutDetach' style="background-color: blue;">
</div>

JavaScript

$element = $('<div><p>Shown</p><button>Click me</button></div>');
$element.children('button').on('click', function () { $element.children('p').toggle(); });
$('#withDetach').append($element);
$('#withDetach').children().detach();
$('#withDetach').append($element);

$element2 = $('<div><p>Shown</p><button>Click me</button></div>');
$element2.children('button').on('click', function () { $element2.children('p').toggle(); });
$('#withoutDetach').html($element2);
// Comment out the following line and they'll both work:
$('#withoutDetach').html($element2);