Debug width and height of elements on resize

jquery.debugsizes.js

  var debugItemSize = function () {

    var debug = jQuery('.YOUR_CLASS');

    debug.each(function () {
      var span;
      if (jQuery(this).find('.debug-span').length) {
        span = jQuery(this).find('.debug-span');
      } else {
        span = jQuery('<span />').addClass('debug-span');
      }
      var w = jQuery(this).outerWidth();
      var h = jQuery(this).outerHeight();
      jQuery(this).prepend(span.html(w + 'x' + h));

      jQuery(this).css({
        "position": "relative",
        "outline": "1px dashed red"
      });

      jQuery(this).find('.debug-span').css({
        "position": "absolute",
        "left": "0",
        "top": "0",
        "background-color": "red",
        "color": "white",
        "padding": "3px 6px",
        "font-family": "sans-serif",
        "font-weight": "bold",
        "z-index": "99999"
      });
    });
  };

  jQuery(window).on('resize', function () {
    debugItemSize();
  });

  debugItemSize();