title: how to show tick image when the image was selected
body: <p>I have images when i select the images one by one while selecting i highlight the image with <code>border:2px solid #b404ae;</code> but i want to put the tick image in the bottom of images while images is selected but it unsuccessful can any one tell me how to do that (i.e. its not showing the image its only showing the bored color)</p>
  
  <p>css:   </p>
  
  <pre><code> .highlighted {
               border:2px solid #b404ae;
               background-image: url(image/tick.png);
  
             }
  </code></pre>
  
  <p>javascript:</p>
  
  <pre><code> &lt;script type="text/javascript"&gt;
  
  
             var ImageSelector = function() {
                var imgs = null;
                var selImg = null;
  
                return {
                   addImages: function(container) {
                      imgs = container.getElementsByTagName("img");
                      for(var i = 0, len = imgs.length; i &lt; len; i++) {
                         var img = imgs[i];
                         img.className = "normal";
                         img.onclick = function()  {
                            if(selImg)   {
                               selImg.className = "normal";
                            }
                            this.className = "highlighted";
                            selImg = this;
                         };
                      }
                   }
                };
             }();
  
            &lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
  
                var div = document.getElementById("textbox");
                ImageSelector.addImages(div);
  
            &lt;/script&gt;
  </code></pre>