JSFiddle - React, Tailwind, and code Playground
HTML
<div class="pricing-table-one left full-width ">
<div class="pricing-table-one-border left">
<div class="pricing-table-one-top pricing-table-green left" style="background:#95705b"> <span style="color:">Restaurant / Café</span>
<p style="color:"></p>
</div>
<div class="pricing-table-one-center pricing-table-white left">
<h5>ONTBIJT</h5>
</div>
<div class="pricing-table-one-center pricing-table-white left">
<h5>LUNCH</h5>
</div>
<div class="pricing-table-one-center pricing-table-white left">
<h5>BRUNCH</h5>
</div>
<div class="pricing-table-one-center pricing-table-white left">
<h5>DINER</h5>
</div>
<div class="pricing-table-one-center pricing-table-white left">
<h5>WEST-FRIESE KOFFIETAFEL</h5>
</div>
<div class="pricing-table-one-center pricing-table-white left">
<h5>SALADESCHOTELS</h5>
</div>
<div class="pricing-table-one-center pricing-table-white left">
<h5>EN NOG VEEL MEER</h5>
</div>
<div class="color-buttons color-button-blue pricing-button"> <a href="mailto:[email protected]?subject=Informatie Restaurant">Voor meer informatie – Email ons</a>
</div>
</div>
</div>
JavaScript
$(function () {
// pdf urls and header names
var pdfUrls = {
'BRUNCH': 'http://domain.nl/wp-content/uploads/2015/02/09/x.pdf',
'DINER': 'http://domain.nl/wp-content/uploads/2015/02/09/y.pdf'
};
// loop through each h5 tag within pricing-table-one
$('.pricing-table-one h5').each(function (i, el) {
var header = $(el).text();
// if a url is found
if (pdfUrls[header]) {
$(el).wrap('<a href="' + pdfUrls[header] + '"></a>');
}
});
});