Lite hjälp med en jQuery uppgift

Hallå, håller på som sagt att pluggar här, men har kört fast helt på en Jquery uppgift då jag missade dom lektionerna så har jag inte så stor koll på hur jag ska göra. Men en liten snapp förklaring är att vi använder oss av flickrs api för att hämta ett antal bilder. Dom här bilderna läggs i en div. och om man sedan klickar på en bild så sparas den i en annan div som kallas "savedImages"
När dom väl ligger där så ska man kunna klicka på en bild där så förstoras bilden upp (vilket jag har löst). Men det jag har problem med är att vi ska då visa taggar osv, samt att man ska kunna redera bilden då man har den i stor vy, samt att den ska visa flickr länken till bilden. Men jag har kört fast totalt då man ska skriva en egen plugin in just detta. Men så här ser det ut än så länge:

flickr.js - tar emot ett sökord och sedan laddar upp bilderna

var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
var nrOfImages = 12;

function getFromFlickr(tagsString, nr){
  
  $('#spinner').spinner(true);

  $.ajax({
    url: flickerAPI,
    data: {
      tags : tagsString,
      tagmode: "any",
      format: "json"
    },
    dataType: "json"

  }).done(function( data ) {
    
    $('#spinner').spinner(false);

    $.each( data.items, function( i, item ) {
      $( "<img>" )
        .attr("src", item.media.m)
        .attr("title", item.title)
        .attr("data-tags", item.tags)
        .attr("data-link", item.link)
        .appendTo( "#images" );
      if ( i === (nr-1) ) {
        return false;
      }
    });

  }).fail(function(){
    console.log('failed');

  }).always(function(){
    console.log('loaded');
  });
  
};

function bindEvents(){

  $('#search').submit(function(event){
    event.preventDefault();
    var tagsString = $('#tags').val();
    $('#images').html(''); 
    getFromFlickr(tagsString, nrOfImages);
  });

  $('#images').on('click','img',function(){
    //$('img').appendTo("#savedImages");
    $(this).appendTo('#savedImages');
    $(this).log();
  });

  $('#savedImages').on('click', 'img', function(){
 $(this).pluginView({
  show: true,
  speed: 200,
  top: 100,
  left: 150
});

  });

};

$(bindEvents);

pluginView.js - Ska då visa upp all info om bilden när man klickar på den samt bilden:

jQuery.fn.pluginView = function(options){

  var settings = jQuery.extend({
      top: 0,
      left: 0,
      width: 600,
      height: 400,
      show: false,
      showingClass: 'showing',
      speed: 400
  }, options);  

  if(settings.show){
    this.addClass(settings.showingClass);
    this.css({
      display: 'block',
      position: 'absolute',
      border: '2px solid white',
      top: settings.top,
      width: settings.width,
      height: settings.height
    });
  }else{
    this.removeClass(settings.showingClass);
    this.css({
      display: '',
      position: '',
      border: '',
      top: '',
      width: '',
      height: ''
    });
  }

  return this;
}

En del av denna kod som jag har skickat med nu fick vi från start att jobba med. Men har som sagt kört fast helt.

OBS jag vill inte ha hela lösningen utan bara lite hintar hur jag ska gå vidare

Tackar så mycket på förhand

kolla med .append() på det element du klickar på ta den och appendar den till din nya div.

sen hade jag kollat på .delegate (eller .on(event, selector)) som man använder nu för att binda "framtida" skapade element inne i din #savedImages

Fast om du skall göra ett plugin så bör click event biten ligga i den kodblocket och isåfall binder du plugin:et när du har append:at bilden in i #savedImages

Tackar så mycket för svaret :) det hjälpte en del på traven vilket gjorde att jag lyckades fixa uppgiften :)