title: How to take the 'src' from an image in a post and make it a background image just for that post with jquery when there's multiple posts on page?
body: <p>Sorry if that question is a mouthful. Basically here's what I'm trying to do:
  <br>Here's the html markup:</p>
  
  <pre><code>&lt;article class="swiper-slide"&gt;
      &lt;div class="image"&gt;&lt;/div&gt;
      &lt;div class="copy"&gt;
          &lt;h1 class="index-name"&gt;&lt;span&gt;Jean-Michel Basquiat&lt;/span&gt;&lt;/h1&gt;
          &lt;div class="article-summary"&gt;
              &lt;img src="img/profiles/profile_jbasquiat.jpg"/&gt;
              &lt;h2&gt;Preview Copy&lt;/h2&gt;
              &lt;a href="#" class="read-more serif"&gt;read more&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/article&gt;
  
  &lt;article class="swiper-slide"&gt;
      &lt;div class="image"&gt;&lt;/div&gt;
      &lt;div class="copy"&gt;
          &lt;h1 class="index-name"&gt;&lt;span&gt;Lorraine Vivian Hansberry&lt;/span&gt;&lt;/h1&gt;
          &lt;div class="article-summary"&gt;
              &lt;img src="img/profiles/profile_lhansberry.jpg"/&gt;
              &lt;h2&gt;Preview Copy&lt;/h2&gt;
              &lt;a href="#" class="read-more serif"&gt;read more&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/article&gt;
  </code></pre>
  
  <p>So what I'm trying to do is take the <code>src</code> for the <code>img</code> element in each <code>div</code> with the class <code>.article-summary</code>, then make that the background image of the related <code>div</code> with the class <code>.image</code> above. Now I have been successful with this script in the past, but only when I'm on an individual page for each of these posts. It targets everything, so I get the same image for all of the background images:</p>
  
  <pre><code>var img = $('.article-summary img').attr('src');
  $('.image').css('background-image', 'url('+img+')');
  </code></pre>
  
  <p>I was looking around and found this script on another <a href="https://stackoverflow.com/questions/37792338/load-an-img-src-as-a-background-image-for-the-div-it-resides-in-with-jquery">stackoverflow post</a>, but I can't get it working either. My images just show up blank. I'm not an expert on the logic of how the JavaScript is working, so I thought I'd ask the experts here.</p>
  
  <p>Any suggestions on how to get this working?</p>