JSFiddle - React, Tailwind, and code Playground

HTML

<div class="project-description">
							<h1 id="project-title-1">Project Title</h1>
							<h1>Project Year</h1>
</div>
	<div class="project-description">
							<h1 id="project-title-2">Project Title</h1>
							<h1>Project Year</h1>
</div>

CSS

.helvetica {
  font-family: Helvetica;
}

.times {
  font-family: Times, Times New Roman;
}

.Arial {
  font-family: Arial;
}

JavaScript

var fonts = ['Arial', 'helvetica', 'times'];

function getRand() {
 return fonts[Math.floor(Math.random() * fonts.length)];
}

var bodyElements = document.querySelectorAll("[id^='project-title']");
for (var bodyEl of bodyElements) {
	bodyEl.className = getRand();
}