title: mouseenter works, mouseleave does not
body: <p>Having trouble with my mouseenter and mouseleave. Ive looked up examples on stack and yt but haven't found anything useful. Im assuming I have to make two functions or maybe just refactor into one. Either way any help is appreciated. I have already declared in the html element itself the height and width at 50px. If you need me to be more specific cool. Im not a professional at javascript so don't get upset that I didn't notice something. If i did just explain to me so i know for future reference. Thanks!</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var modWidth;
  $('#icons a img').on('mouseenter', function(){
    $(this).width(modWidth);
    $(this).height(modWidth);
    var modWidth = 75;
  });
  
  
  $('#icons a img').on('mouseleave', function(){
    $(this).width(modWidth);
    $(this).height(modWidth);
    var modWidth = 50;
  });</code></pre>
  </div>
  </div>
  </p>