Передача миниатюры изображения и соответствующего текста в пользовательский интерфейс JQuery

У меня есть php loop, который извлекает продукты из базы данных. каждый продукт содержит изображение и текст.

Я сделал их перетаскиваемыми с помощью jQuery UI. У меня есть 2 коробки под списком продуктов. 1-я коробка (.dragMedia) - это то место, где я бросаю свои продукты, вторая коробка (#sequenceContainer) - это то, где продукты должны появляться с их собственным эскизом и текстом.

Я не знаю, как передать изображение и текст, чтобы он появился во втором поле. Мне удалось передать текст, но когда я добавляю "образ", он не работает.

PHP и HTML:

 foreach($images as $image) {
                    echo '<div class="businessProdContainer mediaToDrop">
                                <div class="mediaContainer">

                    <span class="mediaDesc">Ipsum lorem blah blah blah</span>
                    <a class="removeItem" href=""></a>
                        <img src="'.$image.'" width="160" height="140" alt="Media"/><br />
                        <div class="statisticsElements">
                            <span>Views</span>&nbsp;&nbsp;<span class="statsViews">1342</span>
                            <br>
                            <span>Likes</span>&nbsp;&nbsp;<span class="statsLikes">106</span>
                            <br>
                            <span><a href="demo-cart.php" >Product info</a></span>
                            <br>


                            <a class="campaignEditorBtn" href="#" id=""></a>
                            <a class="statisticsBtn" href="#" id=""></a>
                            <a class="mediaEditorBtn" href="#" id=""></a>

                        </div>
                        <br>
                                <p class="businessProdFooter">
                                    Submission date:  2013/10/29

                                    <br>
                                    Campaign end date:  12/12
                                    <br>


                                </p>
                        </div>

                    </div>';


                 }

Js:

  var $count= 0;
  var $limit = 5;

 $(function() {

$( ".mediaToDrop" ).draggable({
    cancel: "a.ui-icon", 
  revert: "invalid", 
   appendTo: "body",
  containment: "document",
  helper: "clone",
  cursor: "move"



    });

        $( ".dragMedia" ).droppable({

                      drop: function( event, ui ) {
                          var src = $(event.target).attr( "href" );
                              $count++;
                     if($count == $limit){
                         alert('Maximum of 4 media items!');
                            $(this).droppable("disable");
                         }else{ 

                            $( this )

                              .addClass("highlightDroped")
                              .find( "p" )
                                    .html( $count +" video added" );
                                $( "<li></li>" ).text( ui.draggable.text() ).appendTo($('#sequenceContainer') );


                            }

                      }

        });


  });

Любая помощь будет оценена

Майк