JSFiddle - React, Tailwind, and code Playground

by brigand

HTML

<p>
  Choose the correct word. Then, practice reading the sentence out loud.</p>
<div class="col-md-12 col-sm-12" id="pcblanksentence"></div>
<div class="col-md-6 col-sm-12" id="pccorrectword"></div>
<div><button id="pblckar">Check Answer</button><button id="pblckarset">Next Set</button></div>
<script>
  init();

</script>

JavaScript

var pcpword = [{
    'pcpsentence': 'A country’s _ affects its traditional foods.',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '1',
    'pcpIdentifier': '0',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'This food has a good _.',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '2',
    'pcpIdentifier': '1',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'My favourite _ of ice cream is chocolate.',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '2',
    'pcpIdentifier': '2',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'Canada’s _ is very different from the Middle East.',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '1',
    'pcpIdentifier': '3',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'This soup does not taste good.  You should add salt for _',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '2',
    'pcpIdentifier': '4',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'We studied Canadian __ in class today.',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '1',
    'pcpIdentifier': '5',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'This food has a very spicy _!',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '2',
    'pcpIdentifier': '6',
    'pcpset': '1'
  },
  {
    'pcpsentence': '_ is a subject that we study in school.',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '1',
    'pcpIdentifier': '7',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'These strawberries have a sweet _',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '2',
    'pcpIdentifier': '8',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'The _ of the area is not good for farming.',
    'pcpchoices': ['geography', 'flavour'],
    'pcpcorrect': '1',
    'pcpIdentifier': '9',
    'pcpset': '1'
  },
  {
    'pcpsentence': 'My mother’s ideas are very _ but my ideas are very modern.',
    'pcpchoices': ['traditional', 'individual', 'common'],
   ...