JSFiddle - React, Tailwind, and code Playground

by Akram kamal

HTML

<div id="locations" data-locations='[{"name":"Bath","url":"/location/bath","img":"/thumb.jpg"},{"name":"Berkhamsted","url":"/location/berkhamsted","img":"/thumb.jpg"},{"name":"Bishop&rsquo;s Stortford","url":"/location/bishops-stortford","img":"/thumb.jpg"},{"name":"Cambridge","url":"/location/cambridge","img":"/thumb.jpg"},{"name":"Lymington","url":"/location/lymington","img":"/thumb.jpg"},{"name":"Manchester","url":"/location/manchester","img":"/thumb.jpg"},{"name":"Marlborough","url":"/location/marlborough","img":"/thumb.jpg"},{"name":"Newbury","url":"/location/newbury","img":"/thumb.jpg"},{"name":"Oxford","url":"/location/oxford","img":"/thumb.jpg"}]'></div>

JavaScript

var testOne = $('#locations').data('locations');
console.log(testOne);
$('#locations').append('<p>This works: ' + testOne[4].name + '</p>');