JSFiddle - React, Tailwind, and code Playground

by Ketan Patel

HTML

<div class="listitems"><div id="pin-1" data-position="1" class="hs-box active"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/greater-sudbury-and-manitoulin-district/" alt="Greater Sudbury &amp; Manitoulin District">Greater Sudbury &amp; Manitoulin District</a></span></div><div id="pin-2" data-position="2" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/kawarthas-northumberland-county-of-peterborough/" alt="Kawarthas / Northumberland / County of Peterborough">Kawarthas / Northumberland / County of Peterborough</a></span></div><div id="pin-3" data-position="3" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/kingston/" alt="Kingston">Kingston</a></span></div><div id="pin-4" data-position="4" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/london/" alt="London">London</a></span></div><div id="pin-5" data-position="5" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/muskoka/" alt="Muskoka">Muskoka</a></span></div><div id="pin-6" data-position="6" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/niagara/" alt="Niagara">Niagara</a></span></div><div id="pin-7" data-position="7" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/north-bay/" alt="North Bay">North Bay</a></span></div><div id="pin-8" data-position="8" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/ottawa/" alt="Ottawa">Ottawa</a></span></div><div id="pin-9" data-position="9" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/prescott-russell/" alt="Prescott Russell">Prescott Russell</a></span></div><div id="pin-10" data-position="10" class="hs-box"><span class="regional-name"><a href="https://otectsno.wpengine.com/regional/quinte-west/" alt="Quinte...

JavaScript

jQuery(window).on('load', function(){
	var nvCity = "Windsor Essex";
	jQuery(".regional-name a").each(function() {
    var nvRegion = jQuery(this).attr("alt");
    var nvAtrId = jQuery(this).parent().parent().data("position");
    if(nvRegion==nvCity) {
    	alert(nvRegion.toUpperCase()+"="+nvAtrId);
    }
	});
});