JSFiddle - React, Tailwind, and code Playground

by davehol

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<h1>Accounting</h1>
<div class="m-program-list">


  <table class="table xm-grouped-table">
    <caption class="sr-only">Browse the list of Accounting</caption>
    <thead>
      <tr>
        <th class="m-program-list-level hidden-xxs">Study type</th>
        <th class="m-program-list-program">Program name</th>
        <th class="m-program-list-location"><a class="c-tooltip" data-tooltip="Campuses where you can study this program.">Location</a></th>
        <th class="m-program-list-code hidden-xxs">Code</th>
        <th class="m-program-list-apply"><span class="visible-xxs">Apply</span></th>
      </tr>
    </thead>
    <tbody>
      <tr class="" data-rp-offering-target="Domestic,International" data-local-intakes="">

        <td class="hidden-xxs">Undergraduate</td>
        <td class="m-program-list-title">
          <div class="visible-xxs">Undergraduate</div>
          <a class="m-program-list-title-text js-append-src-url" href="/study-with-us/levels-of-study/undergraduate-study/bachelor-degrees/bp254">
      Bachelor of Business (Accountancy)
    </a>
          <div class="m-program-list-title-code visible-xxs">BP254</div>


        </td>
        <td>
          <div class="" data-extract-major-delim="|" data-extract-glue=", ">Melbourne City</div>
        </td>
        <td class="hidden-xxs">BP254</td>
        <td class="m-program-list-apply">
          <div class="visible-xxs">
            <a href="/study-with-us/levels-of-study/undergraduate-study/bachelor-degrees/bp254/apply-now"><span class="c-icon-30 grunticon-pencil-red-30"></span></a>
          </div>
          <div class="hidden-xxs">
            <a href="/study-with-us/levels-of-study/undergraduate-study/bachelor-degrees/bp254/apply-now"><span class="c-icon-15 grunticon-arw-right-gry91-15" style="margin-top: -7px;"></span>Apply</a>
          </div>
        </td>
        <td class="hide">
          <!--...

CSS

.midyr:before{
  content:" \2022\2002";
  color:red;
  }

JavaScript

$(document).ready(function() {

  var subIntArea = $('H1').text().split(" ").join("_");
  var midyrData = [];
  var midYrFlag = $('<div></div>').css("color", "red").addClass("midyr");
  $('td.m-program-list-title').append(midYrFlag);
  $.ajax({
    type: 'GET',
    url: 'https://spreadsheets.google.com/feeds/list/1BygqhMr4EzDQPAmWAzgCs_yWUOMyblAmYBFxm6hUrhE/1/public/values?alt=json-in-script&callback=?',
    dataType: 'jsonp',
    success: function(json) {
      $.each(json.feed.entry, function(index, item) {
        obj = {};
        obj["code"] = item.gsx$progcode.$t;
        obj["isDom"] = item.gsx$isopendom.$t;
        obj["isInt"] = item.gsx$isopenint.$t;
        midyrData.push(obj);
      });
      updateList();

    },
    error: function(e) {
      alert("Oop's");

    }
  });

  function updateList() {
    //var dave = $("td.m-program-list-apply:eq(5) div:eq(1) a span");
    var intEnqURL = "https://connect.prospectivestudent.info/rmitint";
    var domEnqURL = "http://www.rmit.edu.au/contact/online-enquiries/local-student-enquiries";
    var IntOrDom = (cookieVal() == 'domestic') ? 'isDom' : 'isInt';
    var progTable = $(".m-program-list  table  tbody  tr");

    if (IntOrDom == 'isInt') {
      $('.midyr').text('Open for July intake');
    } else {
      $('.midyr').text('Open Midyear (July intake)');
    }
    $.each(progTable, function(index, row) {
      var $this = $(this);
      var listCode = $("td", $this).eq(3).text();
      var applyBtn = $("td.m-program-list-apply div:eq(1) a", $this);
      var applyBtnMob = $("td.m-program-list-apply div:eq(0) a", $this);
      var spanTag = $("td.m-program-list-apply div:eq(1) a span", $this);
      var hdr = listCode.substring(0, 2);
      if (hdr == 'MR' || hdr == 'DR') {
				 $('.midyr', $this).css("display", "none");
         alert(hdr);
      } else {
        $.each(midyrData, function(i, item) {
          if (listCode == midyrData[i].code) {
            if (midyrData[i][IntOrDom] == 'No') {
         ...