JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
<script src="http://www.chrisloughnane.com/college/trazoo/javascript/paths.js"></script>
<div class="wrapper">
    <div id="result"></div>
    <div id="map"></div>
</div>

CSS

#map { 
    background-color: #5fc9fb;
}
#result {
    position: absolute;
    z-index: 1;
}

JavaScript

$(function(){
    /* control variables */
    var previouscountyselected = "Mayo";
    var start = true;
    var last = null;
    var menu = false;
    var thisPath = null;
    connectArray = new Array();
    
    var paper = Raphael('map', 400, 500),
        attributes = {
            fill: '#fff',
            stroke: '#66CCFF',
            'stroke-width': 1.5,
            'stroke-linejoin': 'round',
            transform: 'S1,1,0,0'
        },
        arr = new Array();                
            
    for (var county in paths) {
        
        var obj = paper.path(paths[county].path);
            
        obj.attr(attributes);
        
        arr[obj.id] = county;
            
        if(arr[obj.id] == 'lakes')
            obj.attr(attributes).attr( { fill: "#66CCFF" } ); /* set lake colour */
                    
        if(arr[obj.id] != 'lakes') /* prevent change of lake colour and mouse click */
        {                
            obj.data('selected', 'notSelected');
        
            /* add ID to paths */
            obj.node.id = arr[obj.id];
            
            /* add title (for qtip) to paths */
            obj.attr(attributes).attr( { title: 'Co. '+paths[arr[obj.id]].name } );
            
            /* associate county names with path id's */
            connectArray[paths[arr[obj.id]].name] = obj.id;                
            
            /* add crests to bottom and set county selections */
            obj.click(function(){
                if(paths[arr[this.id]].value == 'notSelected')
                {
                    if(menu)
                    {
                        changeToWhite(previouscountyselected);
                        menu = false;
                    }

                    /* remove small crest */
                    $("." + previouscountyselected+'small').remove(); 
                    
                    changeToSelected(paths[arr[this.id]].name);

                    paths[previouscountyselected].value =...