JSFiddle - React, Tailwind, and code Playground

by Bruce Anderson

HTML

<a href="https://www.youtube.com/watch?v=ucX9hVCQT_U" target="_blank">Friday I'm in Love</a><br>
<button id="changeDays">Wi not trei a holiday in Sweeden this yer</button>
<template id="Friday">
  <span x-d>It's |.Day5| I'm in love</span>
</template>
<template id="Opening">
  <span x-d>I don't care if |.Day1|'s blue</span><br>
  <span x-d>|.Day2|'s gray and |.Day3| too</span><br>
  <span x-d>|.Day4| I don't care about you</span><br>
  <span data-init="Friday"></span>
</template>

<template id="Main">
  <div data-init="Opening" class="stanza"></div>
  <div class="stanza">
    <span x-d>|.Day1| you can fall apart</span><br>
    <span x-d>|.Day2| |.Day3| break my heart</span><br>
    <span x-d>Oh, |.Day4| doesn't even start</span><br>
    <span data-init="Friday"></span>
  </div>
  <div class="stanza">
    <span x-d>|.Day6| wait</span><br>
    <span x-d>And |.Day7| always comes too late</span><br>
    <span x-d>But |.Day5| never hesitate</span>
  </div>

  <div class="stanza">
    <span x-d>I don't care if |.Day1|'s black</span><br>
    <span x-d>|.Day2|, |.Day3| heart attack</span><br>
    <span x-d>|.Day4| never looking back</span><br>
    <span data-init="Friday"></span>
  </div>
  <div class="stanza">
    <span x-d>|.Day1| you can hold your head</span><br>
    <span x-d>|.Day2|, |.Day3| stay in bed</span><br>
    <span x-d>Or |.Day4| watch the walls instead</span><br>
    <span data-init="Friday"></span>
  </div>
  <div class="stanza">
    <span x-d>|.Day6| wait</span><br>
    <span x-d>And |.Day7| always comes too late</span><br>
    <span x-d>But |.Day5| never hesitate</span>
  </div>
  <div class="stanza">
    <span>Dressed up to the eyes</span><br>
    <span>It's a wonderful surprise</span><br>
    <span>To see your shoes and your spirits rise</span><br>
    <span>Throwing out your frown</span><br>
    <span>And just smiling at the sound</span><br>
    <span>And as sleek as a shriek</span><br>
    <span>Spinning round and round</span><br>
    <span>Always...