JSFiddle - React, Tailwind, and code Playground

by BenjaminRay

HTML

<h1>CSS font-family</h1>

<div class="test">
    <p class="serif">This is a paragraph, shown in the Times New Roman font.</p>
    <p class="sansserif">This is a paragraph, shown in the Arial font.</p>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

CSS

p.serif {
      font-family:"Times New Roman", Times, serif;
  }
  p.sansserif {
      font-family: Arial, Helvetica, sans-serif;
  }
  p {
      color:red;
  }

JavaScript

$("p").click(function () {
        if ($(this).css("color").toLowerCase() == "rgb(255, 0, 0)" 
          || $(this).css("color").toLowerCase() == '#ff0000' 
          || $(this).css("color").toLowerCase() == '#f00') {
            alert("this is red");
        } else {
            alert("this is not red");
        }
    });