title: Change image after window resize with Jquery
body: <p>I've got some troubles with Jquery code. I'd like to change images on the page according to window width...</p>
  
  <p>The code below makes almost what I want but there is one mistake - It prepends more than one image... It makes more and more clones after I re-size browser.</p>
  
  <p>I would be grateful for any help you could give me..</p>
  
  <p>Here is my code</p>
  
  <pre><code>(function ($) {
      var $window = $(window),
          $img2 = $('#img2');
      $img4 = $('#img4');
  
      function resize() {
          if ($window.width() &lt; 750) {
              $img2.remove()
              $('.illu').prepend('&lt;img id="img4" class="illu-img4 pulse_image" src="img/illu4.jpg"  width="100%"/&gt;')
          } else if ($window.width() &gt; 750) {
              $img4.remove()
              $('.illu').prepend('&lt;img id="img2" class="illu-img2 pulse_image" src="img/illu2.jpg"  width="100%"/&gt;')
          }
      }
  
      $window.resize(resize)
          .trigger('resize');
  })(jQuery);
  </code></pre>