Can someone give me an answer for this:
<p>I would like to know either: a. How to use jQuery to use a cookie to save a background image after it is selected, very detailed on how to use jQuery as I never have prior to this, or b. How to use regular javascript to set a cookie for it, I already have cookies for prompts and text in place, but images are getting too complex. Any help will be greatly appreciated! </p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>&lt; script &gt;
  //alert(document.cookie);
  function setCookie(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
    var expires = "expires=" + d.toGMTString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
  }

function getCookie(cname) {
  var name = cname + "=";
  var ca = document.cookie.split(';');
  for (var i = 0; i &lt; ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == ' ') {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
}

function checkCookie() {
  var period_one = getCookie("period1");
  var period_two = getCookie("period2");
  var period_three = getCookie("period3");
  var period_four = getCookie("period4");
  var period_five = getCookie("period5");
  var period_six = getCookie("period6");
  var period_seven = getCookie("period7");
  var period_eight = getCookie("period8");
  var period_nine = getCookie("period9");
  if (period_one != "") {
    document.getElementById('period1a').innerHTML = period_one;
    document.getElementById('period1b').innerHTML = period_one;
    //document.getElementById('period1c').innerHTML=period_one;
    document.getElementById('period1d').innerHTML = period_one;
    document.getElementById('period1e').innerHTML = period_one;
    document.getElementById('period1f').innerHTML = period_seven;
    document.getElementById('period1g').innerHTML = period_seven;
    document.getElementById('period1h').innerHTML = period_seven;
    document.getElementById('period1i').innerHTML = period_seven;
    document.getElementById('period1j').innerHTML = period_seven;
    document.getElementById('period1k').innerHTML = period_seven;
  }
  //alert("period one done");
  if (period_two != "") {
    //alert("period 2 cookie");
    document.getElementById('period2a').innerHTML = period_two;
    //document.getElementById('period2b').innerHTML=period_two;
    document.getElementById('period2c').innerHTML = period_two;
    document.getElementById('period2d').innerHTML = period_two;
    document.getElementById('period2e').innerHTML = period_two;
    document.getElementById('period2f').innerHTML = period_seven;
    document.getElementById('period2g').innerHTML = period_seven;
    document.getElementById('period2h').innerHTML = period_seven;
    document.getElementById('period2i').innerHTML = period_seven;
    document.getElementById('period2j').innerHTML = period_seven;
    document.getElementById('period2k').innerHTML = period_seven;
  }
  if (period_three != "") {
    document.getElementById('period3a').innerHTML = period_three;
    document.getElementById('period3b').innerHTML = period_three;
    document.getElementById('period3c').innerHTML = period_three;
    //document.getElementById('period3d').innerHTML=period_three; 
    document.getElementById('period3e').innerHTML = period_three;
    document.getElementById('period3f').innerHTML = period_seven;
    document.getElementById('period3g').innerHTML = period_seven;
    document.getElementById('period3h').innerHTML = period_seven;
    document.getElementById('period3i').innerHTML = period_seven;
    document.getElementById('period3j').innerHTML = period_seven;
    document.getElementById('period3k').innerHTML = period_seven;
  }
  if (period_four != "") {
    //document.getElementById('period4a').innerHTML=period_four;
    document.getElementById('period5b').innerHTML = period_four;
    document.getElementById('period5c').innerHTML = period_four;
    document.getElementById('period5d').innerHTML = period_four;
    document.getElementById('period5e').innerHTML = period_four;
  }
  if (period_five != "") {
    //document.getElementById('period5a').innerHTML=period_five;
    document.getElementById('period5b').innerHTML = period_five;
    //document.getElementById('period5c').innerHTML=period_five;
    document.getElementById('period5d').innerHTML = period_five;
    document.getElementById('period5e').innerHTML = period_five;
    document.getElementById('period5f').innerHTML = period_seven;
    document.getElementById('period5g').innerHTML = period_seven;
    document.getElementById('period5h').innerHTML = period_seven;
    document.getElementById('period5i').innerHTML = period_seven;
    //document.getElementById('period5j').innerHTML=period_seven; 
    document.getElementById('period5k').innerHTML = period_seven;
  }
  if (period_six != "") {
    document.getElementById('period6a').innerHTML = period_six;
    //document.getElementById('period6b').innerHTML=period_six;
    document.getElementById('period6c').innerHTML = period_six;
    //document.getElementById('period6d').innerHTML=period_six;  
    document.getElementById('period6e').innerHTML = period_six;
    document.getElementById('period6f').innerHTML = period_seven;
    document.getElementById('period6g').innerHTML = period_seven;
    document.getElementById('period6h').innerHTML = period_seven;
    document.getElementById('period6i').innerHTML = period_seven;
    //document.getElementById('period6j').innerHTML=period_seven; 
    document.getElementById('period6k').innerHTML = period_seven;
  }
  if (period_seven != "") {
    //document.getElementById('period7a').innerHTML=period_seven;
    document.getElementById('period7b').innerHTML = period_seven;
    document.getElementById('period7c').innerHTML = period_seven;
    //document.getElementById('period7d').innerHTML=period_seven; 
    document.getElementById('period7e').innerHTML = period_seven;
    document.getElementById('period7f').innerHTML = period_seven;
    document.getElementById('period7g').innerHTML = period_seven;
    document.getElementById('period7h').innerHTML = period_seven;
    document.getElementById('period7i').innerHTML = period_seven;
    //document.getElementById('period7j').innerHTML=period_seven; 
    document.getElementById('period7k').innerHTML = period_seven;
  }
  if (period_eight != "") {
    document.getElementById('period8a').innerHTML = period_eight;
    document.getElementById('period8b').innerHTML = period_eight;
    //document.getElementById('period8c').innerHTML=period_eight;
    document.getElementById('period8d').innerHTML = period_eight;
    document.getElementById('period8e').innerHTML = period_eight;
    document.getElementById('period8f').innerHTML = period_eight;
    document.getElementById('period8g').innerHTML = period_eight;
    document.getElementById('period8h').innerHTML = period_eight;
    document.getElementById('period8i').innerHTML = period_eight;
    document.getElementById('period8j').innerHTML = period_eight;
    document.getElementById('period8k').innerHTML = period_eight;
  }
  if (period_nine != "") {
    document.getElementById('period9a').innerHTML = period_nine;
    //document.getElementById('period9b').innerHTML=period_nine;
    document.getElementById('period9c').innerHTML = period_nine;
    document.getElementById('period9d').innerHTML = period_nine;
    document.getElementById('period9e').innerHTML = period_nine;
    document.getElementById('period9f').innerHTML = period_nine;
    document.getElementById('period9g').innerHTML = period_nine;
    document.getElementById('period9h').innerHTML = period_nine;
    document.getElementById('period9i').innerHTML = period_nine;
    document.getElementById('period9j').innerHTML = period_nine;
    document.getElementById('period9k').innerHTML = period_nine;
  }
}

function setClass(class_period) {
    var class_period = class_period;

    dialog();

    function dialog() {
      var class_name = prompt('Which class do you have period ' + class_period + '?');
      if (class_name.length &gt; 15) {
        alert("Please limit the length to 15 characters")
        dialog();
      } else
        var new_class = "period" + class_period;

      //alert(new_class+' '+class_name);
      setCookie(new_class, class_name, 30);
      document.getElementById(new_class + 'a').innerHTML = class_name;
      document.getElementById(new_class + 'b').innerHTML = class_name;
      document.getElementById(new_class + 'c').innerHTML = class_name;
      document.getElementById(new_class + 'd').innerHTML = class_name;
      document.getElementById(new_class + 'e').innerHTML = class_name;
      document.getElementById(new_class + 'f').innerHTML = class_name;
      document.getElementById(new_class + 'g').innerHTML = class_name;
      document.getElementById(new_class + 'h').innerHTML = class_name;
      document.getElementById(new_class + 'i').innerHTML = class_name;
      document.getElementById(new_class + 'j').innerHTML = class_name;
      document.getElementById(new_class + 'k').innerHTML = class_name;
    }
  }
  //function Close1(){
  // document.getElementById('CA').style.display = "none";
  // document.getElementById('CB').style.display = "none";
  // document.getElementById('CC').style.display = "none";
  // document.getElementById('CD').style.display = "none";
  // document.getElementById('CE').style.display = "none";
  // document.getElementById('CF').style.display = "none";
  // document.getElementById('CG').style.display = "none";
  //}
  &lt; /script&gt;
&lt;script type="text/javascript
"&gt;
function B1(){
 document.body.style = "
background - color: #ccc;
"
}
function P1(){
 document.body.style = "
background - image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/patterns/light-tile.gif');
"
}
function P2(){
 document.body.style = "
background - image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/patterns/charcoal.gif');
"
}
function P3(){
 document.body.style = "
background - image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/patterns/foundation.gif');
"
}
function P4(){
 document.body.style = "
background - image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/patterns/presence.png');
"
}
function P5(){
 document.body.style = "
background - image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/images/skulls.png');
"
}
function P6(){
 document.body.style = "
background - image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/images/grey_wash_wall.png');
" &lt; /script&gt;</code></pre>
<pre class="snippet-code-css lang-css prettyprint-override"><code>@charset "utf-8";
.textures1 {
  text-align: center;
  margin: 0 auto;
  width: 35%;
  height: 10%;
}
a {
  text-decoration: none;
  font-size: 35px;
}
#PairOne {
  border: 2px solid gray;
  float: left;
  background-color: #FFF;
  padding: 15px;
  margin-bottom: 25px;
  box-shadow: 5px 5px 5px #888888;
  height: 300px;
  width: 25%;
  margin-left: 5%;
  margin-right: 0%;
  border-radius: 50px;
  background-image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/patterns/light-tile.gif');
}
#PairTwo {
  border: 2px solid gray;
  float: right;
  background-color: #FFF;
  padding: 15px;
  margin-bottom: 25px;
  box-shadow: 5px 5px 5px #888888;
  height: 300px;
  width: 25%;
  margin-right: 5%;
  border-radius: 50px;
  background-image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/patterns/charcoal.gif');
}
#PairThree {
  border: 2px solid gray;
  float: none;
  background-color: #FFF;
  padding: 15px;
  margin-bottom: 25px;
  box-shadow: 5px 5px 5px #888888;
  height: 300px;
  width: 25%;
  border-radius: 50px;
  background-image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/patterns/foundation.gif');
}
#PairFour {
  border: 2px solid gray;
  float: left;
  background-color: #FFF;
  padding: 15px;
  margin-top: auto;
  margin-bottom: 25px;
  box-shadow: 5px 5px 5px #888888;
  height: 300px;
  width: 25%;
  margin-left: 5%;
  border-radius: 50px;
  background-image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/patterns/presence.png');
}
#PairFive {
  border: 2px solid gray;
  float: right;
  background-color: #FFF;
  padding: 15px;
  margin-top: auto;
  margin-bottom: 25px;
  box-shadow: 5px 5px 5px #888888;
  height: 300px;
  width: 25%;
  margin-right: 5%;
  border-radius: 50px;
  background-image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/images/skulls.png');
}
#PairSix {
  border: 2px solid gray;
  background-color: #FFF;
  padding: 15px;
  margin-top: auto;
  margin-bottom: 25px;
  box-shadow: 5px 5px 5px #888888;
  height: 300px;
  width: 25%;
  border-radius: 50px;
  background-image: url('https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/textures/images/grey_wash_wall.png');
}
#PairSeven {
  border: 2px solid gray;
  background-color: #FFF;
  padding: 15px;
  margin-top: auto;
  margin-bottom: 25px;
  box-shadow: 5px 5px 5px #888888;
  height: 300px;
  width: 50%;
  -webkit-border-top-left-radius: 2em;
  -webkit-border-top-right-radius: 2em;
  -webkit-border-bottom-right-radius: 5em;
  -webkit-border-bottom-left-radius: 5em;
  background-color: #ccc;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;

&lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;

  &lt;meta id="viewport" name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"&gt;
  &lt;title&gt;HP Bells&lt;/title&gt;
  &lt;link rel="icon" href="https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/Bell-icon.png"&gt;
  &lt;link href="https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/large-device.css" rel="stylesheet" type="text/css"&gt;
  &lt;link href="https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/small-device.css" rel="stylesheet" type="text/css"&gt;
&lt;/head&gt;

&lt;body onload="checkCookie()"&gt;
  &lt;!--Form start--&gt;
  &lt;div id="form" class="form"&gt;
    &lt;div class="period"&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period1e" onclick="setClass(&amp;#39;1&amp;#39;);"&gt;1&lt;/p&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period2e" onclick="setClass(&amp;#39;2&amp;#39;);"&gt;2&lt;/p&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period3e" onclick="setClass(&amp;#39;3&amp;#39;);"&gt;3&lt;/p&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period4e" onclick="setClass(&amp;#39;4&amp;#39;);"&gt;4&lt;/p&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period5e" onclick="setClass(&amp;#39;5&amp;#39;);"&gt;5&lt;/p&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period6e" onclick="setClass(&amp;#39;6&amp;#39;);"&gt;6&lt;/p&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period7e" onclick="setClass(&amp;#39;7&amp;#39;);"&gt;7&lt;/p&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period8e" onclick="setClass(&amp;#39;8&amp;#39;);"&gt;8&lt;/p&gt;
      &lt;p style="background-color: #ff0000;" class="button" id="period9e" onclick="setClass(&amp;#39;9&amp;#39;);"&gt;9&lt;/p&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;!--Form end--&gt;
  &lt;!--End last day--&gt;
  &lt;div id="footer"&gt;
    &lt;h1&gt;HP Bells&lt;/h1&gt;
    &lt;div class="image-wrapper"&gt;
      &lt;img src="https://cce833b91e811adae55f3df28bdf8619568433c8.googledrive.com/host/0BzMImB5PZZJHdGRDeS1rck5JQjg/logo.png" class="scale-image"&gt;
    &lt;/div&gt;
    &lt;div&gt;
      &lt;!--Textures--&gt;
      &lt;h1&gt;Click to change wallpaper&lt;/h1&gt;
      &lt;link href="texture.css" rel="stylesheet" type="text/css" /&gt;
      &lt;div id="container"&gt;
        &lt;div class="textures1" id="PairOne" onclick="P1(); AB2();"&gt;
          &lt;h1&gt;&amp;nbsp;&lt;/h1&gt;
        &lt;/div&gt;
        &lt;div class="textures1" id="PairTwo" onclick="P2(); AB1();"&gt;
          &lt;h1&gt;&amp;nbsp;&lt;/h1&gt;
        &lt;/div&gt;
        &lt;div class="textures1" id="PairThree" onclick="P3(); AB2();"&gt;
          &lt;h1&gt;&amp;nbsp;&lt;/h1&gt;
        &lt;/div&gt;
        &lt;div class="textures1" id="PairFour" onclick="P4(); AB1();"&gt;
          &lt;h1&gt;&amp;nbsp;&lt;/h1&gt;
        &lt;/div&gt;
        &lt;div class="textures1" id="PairFive" onclick="P5(); AB2();"&gt;
          &lt;h1&gt;&amp;nbsp;&lt;/h1&gt;
        &lt;/div&gt;
        &lt;div class="textures1" id="PairSix" onclick="P6(); AB1();"&gt;
          &lt;h1&gt;&amp;nbsp;&lt;/h1&gt;
        &lt;/div&gt;
        &lt;div class="textures1" id="PairSeven" onclick="B1(); AB2();"&gt;
          &lt;h1&gt;&amp;nbsp;&lt;/h1&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;a href="http://hpregional.org/"&gt;High Point's Website&lt;/a&gt;
      &lt;!--End textures--&gt;
    &lt;/div&gt;
    &lt;!--End footer--&gt;
  &lt;/div&gt;
  &lt;!-- end container --&gt;
&lt;/body&gt;

&lt;/html&gt;</code></pre>
</div>
</div>
</p>