使用jquery将一个元素移动到另一个元素的偏移位置

Question

我努力将一个标签移动到另一个动画（左边：200px）标签的位置。实际上我正在开发类似下面的游戏，如下图所示，

当我点击左侧问题时，它会动画左侧为200px，同时点击右侧答案，如果是正确答案，右侧点击标签应该靠近左侧点击标签的位置移动。我试过下面的代码，

CSS：

.questions {

margin: 5px;
padding: 10px!important;
border: 2px dashed #f0ad4e;
border-radius: 5px;
background-color: #eeeeee;
z-index: 50;
float: left;
text-align: center;

list-style:none;
}
.answers {

margin: 5px;
padding: 10px!important;
border: 2px solid #5bc0de;
border-radius: 5px;
background-color: #eeeeee;
z-index: 9999;
float: left;
text-align: center;
list-style:none;
}

#first {

    float:left; /* add this */

    height: 350px;
    padding-left: 350px;
}
#second {

   float:left;
     height: 350px;
     padding-left: 450px;
}

label, span { position: relative; }

index.jsp：

<div id="first" class="">            

<%

    String class1=session.getAttribute("class").toString();
    //String userid=session.getAttribute("user_id").toString();
    String chapter="Plants";
    String subject=session.getAttribute("subject").toString();


    try{

    if(session.getAttribute("class")!=null&&session.getAttribute("user_id")!=null&&session.getAttribute("subject")!=null)
        {

           System.out.println(class1+"\n"+subject);

           Class.forName("com.mysql.jdbc.Driver");
            Connection connection =DriverManager.getConnection("jdbc:mysql://localhost:3306/raptor1_5","root","");
            Statement st=connection.createStatement();
            Statement st2=connection.createStatement();
            ResultSet rs2=null;
            ResultSet rs=st.executeQuery("select questions from tbl_MatchTheFollwing where class='"+class1+"' and subject='"+subject+"' and chapter='"+chapter+"' order by rand() limit 5");


     while(rs.next())
       {    
         String qest=rs.getString("questions").toString();

         String nospacestring = qest.replaceAll("\\s+","");

         System.out.println("nospace strinf :"+nospacestring);

          %>
       <label id="<%=nospacestring %>" class="dropzone"><%=qest %></label><br><br><br><br>


       <% }%>
        </div>
        <div id="second">
      <%

       rs2=st.executeQuery("select answers from tbl_MatchTheFollwing where class='"+class1+"' and subject='"+subject+"' and chapter='"+chapter+"' order by rand() limit 5");

       while(rs2.next())
           {
             String answer=rs2.getString("answers");

             String [] a2 = answer.split("_");
             System.out.println("a[0] :"+a2[0]);
             System.out.println("a[0] :"+a2[1]);


            StringBuffer result = new StringBuffer();
            for (int i = 1; i < a2.length; i++) {
             result.append( a2[i] );
            }
            String mynewstring = result.toString();

            System.out.println("mynewstring :"+mynewstring); 

            String labelname = mynewstring.replaceAll("\\s+","");

            System.out.println("labelname  :"+labelname); 

            StringBuffer result2 = new StringBuffer();
               for (int i = 0; i == 0; i++) {
                result2.append( a2[i] );
               }
              String mynewstring2 = result2.toString();

              System.out.println("mynewstring2 :"+mynewstring2); 

              String idnamenospace = mynewstring2.replaceAll("\\s+","");

              System.out.println("labelname2  :"+idnamenospace); 


               %>
    <label id="<%=idnamenospace %>" class="item" name="<%=labelname%>"><%=a2[1] %></label><br><br><br><br>


             <% }%>
           </div>


         <%


            }
    }
    catch(Exception e)
           {
            e.printStackTrace();
           }

        %>

<input type="hidden" id="textid" value="">

<script>
$('.questions').click(function(){

$(this).animate({left:"200px"},"slow" );

var Ques = $(this).attr('id');

$('#textid').val(Ques);

});

$('.answers').click(function(){

$(this).animate({right:'200px'});

var Ans =$(this).attr('id');//get id value of clicked right side answer

var Ques =$('#textid').val();//get id value of clicked question

if(Ques==Ans)
    {
      T  = $("#"+Ques).offset().top;//getting current top of cliked question
      L = $("#"+Ques).offset().left;//getting current left of cliked question  
      // alert('x :'+T+'\n'+'y :'+L);

      $(this).animate({bottom:T+'px'}); // here trying to move near right question but cant!
      $(this).animate({right:L+'px'});

   }
});
</script>

我想像下图那样做，