This is a jquery/javascript that allows us to change the visible status of a "liked" status of an element, then store that preference in a user's browser so that the changed state remains upon returning to the page. This was built specifically for http://moda2.studiok40.com/index-moda.html but can be modified for anyone else's purposes

user_favorites.js

/** SCRIPTS FOR DESIGNATING WHEN ITEMS ARE LIKED, STORING THAT PREFERENCE,
AND LOADING THOSE PREFERENCES UPON PAGE REFRESH **/

/** when you click on a featured heart, make it liked **/  
$(".solution_item .liked_status").click(function(){
  // create a variable that references the containing parent of heart just clicked
  const self = $(this).parent();
  
  // create a variable that contains just the ID of the parent element
  const likedToolID = self.attr("id");  
  
  /* changed liked status */
  self.toggleClass("liked");

  /* upon clicking a heart, check to see if user's action was either to like or unlike
  the tool. Then set the localStorage keypair to reflect that preference **/
  if (document.getElementById(likedToolID).classList.contains("liked")) {
    localStorage.setItem(`${likedToolID}-liked`, 'true');
  }
  else if (!document.getElementById(likedToolID).classList.contains("liked")) {
    localStorage.setItem(`${likedToolID}-liked`, 'false');
  }
  // in case our variable likedToolID no longer returns a valid value
  else {
    console.log(`not able to find object, or it's null`)
  }
});


/** UPON PAGE LOAD, RETRIEVING THE VALUES IN STORAGE,
AND APPLYING LIKED STATUS TO ELEMENTS **/

// create an array of all elements that contain our target class
var elements = document.getElementsByClassName("solution_item");

// create an empty array that will store all our ID's of the elements that contain our target class
var toolsArray = [];

// loop through the elements array, pull out just the ID of the elements, then store that to a new array
for(var i=0; i<elements.length; i++) {
    toolsArray.push(elements[i].id);
}

/* go through the toolsArray array and for every value within it,
 check to see if there is a localStorage key for this ID (with -liked apended)
and has an associated value of true with it */

for (let i = 0; i < toolsArray.length; i++){
  //console.log();
    let savedPreference = toolsArray[i];
  if (localStorage.getItem(`${savedPreference}-liked`) === 'true') {
    console.log(`${savedPreference} is liked`);
    /* when it finds a key-value of true indicating an item is liked,
    add the class of "liked" to that element */
    var _digitalTool = $(`#${savedPreference}`);
    _digitalTool.addClass('liked');
  }
}