Run 1 of 3 functions randomly, then set cookie to only run that function until the cookie expires

I have a codepen here (http://ift.tt/2vz8W3x) that shows a random colored boat on page refresh.

I would like to lock the user into a boat color once per day, then allow them to have another random selection the next day that would also last 24hrs or until the cookie expires.

The code now is all run via the showImageNTextSimple() function. Within that function one of 3 images are chosen:

if (t == 1)  { 
    newSrc = "http://ift.tt/2uAhgme"; 
    myText = "<h3>You've got the Red Boat!</h3>";
    }

else if (t == 2) {
    newSrc = "http://ift.tt/2vz8tOW"; 
    myText = "<h3>You've got the White Boat!</h3>";
    }

else if (t == 3) {
    newSrc = "http://ift.tt/2uA1o3i"; 
    myText = "<h3>You've got the Blue Boat!</h3>";  
    }

In each of these if statements I can create 3 cookies like this:

createCookie("boatColor", redBoat, 0.00034722222);
createCookie("boatColor", whiteBoat, 0.00034722222);
createCookie("boatColor", blueBoat, 0.00034722222);

With this in place, at the beginning of my Javascript I would add this:

$(document).ready(function() {      
var cookie = readCookie("boatColor");
if (cookie != redBoat && cookie != whiteBoat && cookie != blueBoat) {
    createCookie("boatColor", [THIS NEEDS TO BE SET BASED ON WHAT COLOR SHOWS UP RANDOMLY THE 1st TIME], 0.00034722222);
} else if (cookie == redBoat) {
     showRedBoat();
  } else if (cookie == whiteBoat) {
    showWhiteBoat();
  } else if (cookie == blueBoat) {
    showBlueBoat();
});

These functions don't exist (showRedBoat(), etc...) though. The one function showImageNTextSimple() controls the display of one of 3 images rather than having 3 functions for each image.

Does anyone have a suggestions on the best way to code this?