title: jQuery on click change large image
body: <p>I am trying to change the large image when you click the thumbnail    </p>
  
  <pre><code>$("#thumbnails a").click(function(){                
                   $id = $(this).attr("id");
                   $("#large-img img" . $id).addClass("active");      
                   return false;
              });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="large-img"&gt;
          &lt;img src="1.jpg" alt="" title="" id="yes" style="display: none;"/&gt;        
          &lt;img src="2.jpg" alt="" title="" id="no" style="display: none;"/&gt;
  &lt;/div&gt;
  
  &lt;div id="thumbnails"&gt;
              &lt;a href="#" id="yes"&gt;
                  &lt;img src="1_small" alt="" title="" width="76" height="76"/&gt;
              &lt;/a&gt;
              &lt;a href="#" id="no"&gt;
                  &lt;img src="2_small.jpg" alt="" title="" width="76" height="76"/&gt;    
              &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is my old code but you cant fade it. I want to achieve the same sort of thing.</p>
  
  <pre><code>$('#thumbnails a').click(function(){
                  $('#large-img').css('background-image', 'url(' + $img + ')');
                  $('#medium-img').css('background-image', 'url(' + $img + ')');              
              return false;
          });
  </code></pre>