Below is my jQuery scriptfile, all the functionality works (except for the click events on IE). I bring this before you guys to ensure I am effectively separating concerns and writing efficient scripts.( function( $ ) {  $( document ).ready(function() {    setTimeout(textFill, 50);    fitheadliner();    showExcerpt();    hideExcerpt();  });  $(window).resize( function() {    fitheadliner();    textFill();  });  function showExcerpt() {    $('img.moreInfo').each(function() {      var $excerpt = $(this),        $excerptParent = $excerpt.parent();      $excerpt.click(function() {        var $boxInfo = $excerptParent.children('.modalExcerpt');        $boxInfo.css(display, initial);      });    });  }  function hideExcerpt() {    $('.xBox').each(function() {      var $thisBox = $(this);      $thisBox.click(function() {        $thisBox.parent().css(display, none);      });    });    $('.modalExcerpt').mouseleave(function() {      if ($(window).width() > 700) {        $(this).css(display, none);      };    });  }  function fitheadliner() {    $(.bigHeadline).each(function() {    var      $parent = $(this).parent(),      $headline = $(this);    var      textW = $headline.width(),      parentW = $parent.width(),      ratio = parentW / textW;    var      originalSize = parseFloat($headline.css('font-size')),      newSize = originalSize * (.99 * ratio);      $headline.css(font-size, newSize);    });  }function textFill() {  $(.textFill).each(function() {    var $text = $(this),      $parent = $text.parent(),      textW = $text.width(),      textH = $text.height(),      parentW = $parent.width(),      parentH = $parent.height(),      ratio = (parentW + parentH) / (textW + textH),      originalSize = parseFloat($text.css('font-size'));     var      newSize = originalSize * (.9 * ratio);    $text.css(font-size, newSize);  });}} )( jQuery );
Showing and hiding text excerpts
javascript;jquery