title: If image width is less than X, add class
body: <p>As the title suggests, I'm looking to have a little bit of jQuery - if an image is less than a defined width, it adds a class a certain element. This, for me, seems pretty easy but for some reason it's not working.</p>
  
  <pre><code>$(document).ready(function() {
      var image = $('.work-each img');
          if (image.width() &lt; 500) {
              $('.work-text').addClass('work-text-small');
          }
  });
  </code></pre>
  
  <p>This, should, add a class 'work-text-small' to the element 'work-text' if the image found under each .work-each is less than 500px.</p>
  
  <p>Example of HTML (for each)</p>
  
  <pre><code>&lt;div class="work-each"&gt;
     &lt;div&gt;
        &lt;img src=""/&gt;
        &lt;div class="work-text"&gt;
           &lt;p&gt;Title&lt;/p&gt;
           &lt;p&gt;Text&lt;/p&gt;
        &lt;/div&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="work-each"&gt;
     &lt;div&gt;
        &lt;img src=""/&gt;
        &lt;div class="work-text"&gt;
           &lt;p&gt;Title&lt;/p&gt;
           &lt;p&gt;Text&lt;/p&gt;
        &lt;/div&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="work-each"&gt;
     &lt;div&gt;
        &lt;img src=""/&gt;
        &lt;div class="work-text"&gt;
           &lt;p&gt;Title&lt;/p&gt;
           &lt;p&gt;Text&lt;/p&gt;
        &lt;/div&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Thanks,
  R</p>