JSFiddle - React, Tailwind, and code Playground
HTML
<div id="foo">
<span data-foo="foo"></span>
</div>JavaScript
// Clone the source element
var source = $('#foo');
var clone = source.clone();
// Update the ID attribute
clone.attr('id', 'bar');
var child = clone.children().first();
// Update the data-foo attribute
child.attr('data-foo', 'not bar');
// Suddenly data('foo') !== attr('data-foo')
console.log(child.data('foo'), child.attr('data-foo'));