problem description

requirement is like this: when I click the right mouse button to come out a menu, and then click New, there will be a right editing mania. When I click Save , I will create a new menu where I click the right mouse button. This menu is concatenated with a string in js. When it is stitched together, I add an addEndpoint to A1 and Q1 respectively (which is actually equivalent to inserting a svg); into the element. As a connection point, after I created the first element, the addEndPoint location is normal, but when I built the second one, the addEndpoint element was not added to the second new element, but ran to the first new element as shown in the first picture, but the location ran inexplicably far away. I saw that the element was indeed added to the first new element in firebug. Excuse me, how should this be solved?

the effect picture of the problem

Code executed on save

 var count =0;
    $("body").on("click","-sharpsave",function(){
        console.log(ContextLeft,ContextTop);
        console.log($(".drag-area").offset().left,$(".drag-area").offset().top);
        countPP;
        var cellLeft = ContextLeft-$(".drag-area").offset().left;
        var cellTop = ContextTop-$(".drag-area").offset().top;
        console.log(cellTop);
        let eleTitle=$(`<div class="drag-question" data-sign="${count}" id="${count}-question">Q</div>`);
        let eleAnswer=$(`<div class="drag-answer" data-sign="${count}" id="${count}-answer">A1</div>`)
        let ele = $(`<div class="drag-cell" >
               </div>`).append(eleTitle).append(eleAnswer).addClass("draggable")
        ele.css({"left":cellLeft,"top":cellTop,position: "absolute",margin:0});
        ele.draggable({containment: ".drag-area"})
        $(".drag-area").append(ele)
        jsPlumb.addEndpoint(eleAnswer, origin,{ anchors: "BottomCenter" });//
        jsPlumb.addEndpoint(eleTitle , destination,{ anchors: "TopCenter" });//
        jsPlumb.draggable(eleTitle,{containment: "parent"});//,
        jsPlumb.draggable(eleAnswer,{containment: "parent"});//,
    })
})

what result do you expect?

I hope that the join point in the second new element will appear correctly in the element, not as shown in the figure, in the first new element and far away,