JSFiddle - React, Tailwind, and code Playground

HTML

<div id="test" data-href="/one/"></div>


<div>result1:</div>
<div id="result1"></div>
<div>result2:</div>
<div id="result2"></div>
<div>result3:</div>
<div id="result3"></div>
<div>result4:</div>
<div id="result4"></div>

JavaScript

// PASS, expected: {"href": "/one/"}
var result1 = $('#test').data();
$('#result1').text(JSON.stringify(result1));

// PASS, expected: {"href": "/one/"}
$('#test').attr('data-href', '/two/');
var result2 = $('#test').data();
$('#result2').text(JSON.stringify(result2));

// FAIL, expected: {"href": "/two/"}
var result3 = $('#test').removeData().data();
$('#result3').text(JSON.stringify(result3));

// PASS, expected: "/two/"
var result4 = $('#test').data('href');
$('#result4').text(JSON.stringify(result4));