Way to let user choose between two font options?

Design help Layout & Design
1

I decided to use a font called Dyslexie which is intended to help the reading process for individuals with dyslexia but it’s sort of an unusual style that I could see other readers preferring an alternative font for the body text of my text-heavy educational website (sample page, not yet mobile compatible: https://www.randomnurses.com/anatomy-and-physiology/cell-and-tissues).

How might go about making it so the viewer can choose between Dyslexie and a, say, Verdana?

UPDATE I decided to work with a different font for the time being instead including screen shot of the Dyslexie font:

Screen Shot 2022-07-30 at 4.33.07 AM
Screen Shot 2022-07-30 at 4.33.07 AM1920×1158 187 KB

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

You’ll have to use custom code and create a button that triggers the function that changes the font family.

Can easily be done with JQuery

3

It would look something like this

$(“.mybutton”).click(function(){
$(“.bodytext”).css(“font-family”, “otherfont”);
});