JSFiddle - React, Tailwind, and code Playground

by Jake

JavaScript

// outer function is so that we can return on :11
(function(){
	//Grab and store the title attributes from each link
	var links = document.querySelectorAll('.give-now-buttons > a');
	var linksArr = Array.prototype.slice.call(links);

	//Grab every element with the js-tipped-footer class
	var tippedAll = document.querySelectorAll('.js-tipped-footer');
	// if we have no results, stop, otherwise we'll throw exceptions
	if( ! tippedAll )
		return;

	var tippedFooterArr = Array.prototype.slice.call(tippedAll);

	// reusable function with failsafes
	var applyTitleFromData = function( el ){
		if( typeof el.dataset === 'undefined' )
			return;
		var t = el.dataset.title;
		if( ! t )
			return;
		el.setAttribute('title', t);
	};

	for (var i = 0; i < tippedFooterArr.length; i++) {
		// reset the title attribute for each link, which was previously
		// stripped out by the tippedjs library
		applyTitleFromData( tippedFooterArr[i] );

		// alternative to jQuery.hover( function(){}, function(){} );
		tippedFooterArr[i].addEventListener('mouseenter',function(){
			this.removeAttribute('title');
		});
		tippedFooterArr[i].addEventListender('mouseleave',function(){
			applyTitleFromData( this );
		});
	}
})();