JSFiddle - React, Tailwind, and code Playground
HTML
<ul class="rows" id="row0">
<li><a href="javascript:void(0)"></a>
</li>
<li><a href="javascript:void(0)"></a>
</li>
<li><a href="javascript:void(0)"></a>
</li>
<li><a href="javascript:void(0)"></a>
</li>
<li><a href="javascript:void(0)"></a>
</li>
</ul>
<ul class="rows" id="row1">
<li><a href="javascript:void(0)"></a>
</li>
<li><a href="javascript:void(0)"></a>
</li>
<li><a href="javascript:void(0)"></a>
</li>
<li><a href="javascript:void(0)"></a>
</li>
<li><a href="javascript:void(0)"></a>
</li>
</ul>
<div id="clueContainer" class="center">Clues</div>
JavaScript
$(document).ready(function () {
var rows = [
[{
name: "$100",
value: "On the world political map, where were some of the major states and empires located about 1500 A.D. (C.E.)?"
}, {
name: "$200",
value: "What were the artistic, literary, and intellectual ideas of the Renaissance?"
}, {
name: "$300",
value: "Where were the five world religions located around 1500 A.D. (C.E.)?"
}, {
name: "$400",
value: "What were the regional trading patterns about 1500 A.D. (C.E.)?"
}, {
name: "$500",
value: "Why were the regional trading patterns important?"
}],
[{
name: "$100",
value: "Who cares about the price of tea in China?"
}, {
name: "$200",
value: "Why did the chicken cross the road?"
}, {
name: "$300",
value: "How much wood could a woodchuck chuck if a woodchuck could chuck wood?"
}, {
name: "$400",
value: "How many SEO specialists does it take to change a light, bulb, lightbuld, energy, electricity?"
}, {
name: "$500",
value: "Where in the world is Carmen San Diego?"
}]
];
$(".rows").each(function (p) {
$("#row" + p).find("a").each(function (i) {
$(this).text(rows[p][i].name);
$(this).click(function () {
var value = rows[p][i].value;;
$("#clueContainer").html(value);
});
});
});
});