JSFiddle - React, Tailwind, and code Playground

by mattoc

HTML

<html>
    
    <head>
        <title>jQuery.watch() with HTML5 data-* in Firefox caveat</title>
    </head>
    
    <body>
        <p>Clicking on the button below should pop up a javascript alert dialog, yet in Firefox with an older version of jQuery (< 1.7) it will alert a string of native browser code. See <a href="http://mattoc.com/jquery-data-caveat-for-html5-in-firefox/">http://mattoc.com/jquery-data-caveat-for-html5-in-firefox/</a> for more info.</p>
	<hr>
	<button id="playlist_1" data-watch="http://www.youtube.com/watch?v=w8NfTRP_MLo">Watch Video</button>
    </body>

</html>

CSS

body { margin: 2em; }

JavaScript

var item = $('#playlist_1');

item.click(function(e) {
    alert($('#playlist_1').data('watch'));
});