title: Jquery - background-image change with data attributes from select
body: <p>What do I have to change to get it working?</p>
  
  <p>When I try to access <code>$(this).data("image")</code>, it is <code>undefined</code>.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="imagecontainer"&gt;&lt;/div&gt;
       &lt;select class="image"&gt;
        &lt;option data-image="url(http:www.test.de/images/test1.jpg)"&gt;Image1&lt;/option&gt;
        &lt;option data-image="url(http:www.test.de/images/test2.jpg)"&gt;Image2&lt;/option&gt;
        &lt;option data-image="url(http:www.test.de/images/test3.jpg)"&gt;Image3&lt;/option&gt;
        &lt;option data-image="url(http:www.test.de/images/test4.jpg)"&gt;Image4&lt;/option&gt;
      &lt;/select&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>$('.image').on('change', function() {
      $( "#imagecontainer" ).css( "background-image", ( $(this).data("image") ) );
  })
  </code></pre>