title: Change image with click on thumbnail
body: <p>How can I change the image by click on the thumbnail below? Because the thumbnail is display with <code>background-image</code>. </p>
  
  <p>How can I get the url by click on the thumbnail to change the bigger image?</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-css lang-css prettyprint-override"><code>.ci-top {
    clear: both;
    display: inline-block;
    width: 100%;
  }
  
  .top-left {
    float: left
  }
  
  .ci-bottom {
    text-align: right;
  }
  
  .ci-thumb {
    height: 150px;
    width: 150px;
    margin: 0;
    display: inline-block;
  }
  
  .ci-thumb-1 {
    background-image: url(http://placeholder.pics/svg/300/FF2209);
  }
  
  .ci-thumb-2 {
    background-image: url(http://placeholder.pics/svg/300/5BFF76);
  }
  
  .ci-thumb-3 {
    background-image: url(http://placeholder.pics/svg/300/325BFF);
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="ci-main"&gt;
  
    &lt;div class="ci-top"&gt;
      &lt;div class="top-left"&gt;&lt;img id="change-img" src="http://placeholder.pics/svg/300/FF2209"&gt;&lt;/div&gt;
      &lt;div class="top-right"&gt;
        &lt;h1&gt;test&lt;/h1&gt;
        &lt;span&gt;Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.&lt;/span&gt;&lt;/div&gt;
    &lt;/div&gt;
  
  
    &lt;div class="ci-bottom"&gt;
      &lt;div class="ci-thumb ci-thumb-1"&gt;&lt;/div&gt;
      &lt;div class="ci-thumb ci-thumb-2"&gt;&lt;/div&gt;
      &lt;div class="ci-thumb ci-thumb-3"&gt;&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I know, how to get and change the url by click somewhere but I don't know how to get the url of a background image and then change it at the bigger image.</p>
  
  <pre><code>&lt;img id="change-img" .. &gt;
  </code></pre>