uuid in jsplumb not working

Question

I wrote this code for creating endpoints and connect them dynamically but I can't use uuid for that mean. uuid is not working in my code, the code is working when i use id of my Divs instead of uuid. my jsplumb version is 1.5.5,

var targetOption = {  
                    anchor: "TopCenter",  
                    maxConnections: -1,  
                    isSource: false,  
                    isTarget: true,  
                    endpoint: ["Dot", { radius: 5 }],  
                    connector: ["Flowchart", { stub: 5 }],  
                    paintStyle: { 
                                 fillStyle: "black",
                                 outlineColor: "black",
                                 outlineWidth: 3 },  
                    hoverPaintStyle: { fillStyle: "green" },  
                    connectorPaintStyle: {  
                    lineWidth: 4,  
                    strokeStyle: "#61B7CF",  
                    joinstyle: "round",  
                    outlineColor: "white",  
                    outlineWidth: 2  
                    },
                    setDragAllowedWhenFull: true  
                   }
var sourceOption = {  
                   anchor: "BottomCenter",  
                   maxConnections: -1,  
                   isSource: true,  
                   isTarget: false,  
                   endpoint: ["Dot", { radius: 5 }],  
                   connector: ["Flowchart", { stub: 5 }],  
                   paintStyle: { 
                               fillStyle: "black",
                               outlineColor: "black",
                               outlineWidth: 3 },  
                   hoverPaintStyle: { fillStyle: "green" },  
                   connectorPaintStyle: {   
                   lineWidth: 4,  
                   strokeStyle: "#61B7CF",  
                   joinstyle: "round",  
                   outlineColor: "white",  
                   outlineWidth: 2  
                  },  
                  setDragAllowedWhenFull: true  
                  }
    var e0 = jsPlumb.addEndpoint("block1", { uuid: "block1_TopCenter", scope: "c" }, targetOption),
        e1 = jsPlumb.addEndpoint("block2", { uuid: "block2_BottomCenter", scope: "c" }, sourceOption);
    var firstInstance = jsPlumb.getInstance();
    var connection2block = firstInstance.connect({
                                                  uuids: ["block2_BottomCenter", "block1_TopCenter"],
                                                  detachable: true,
                                                  fireEvent: true,
                                                  scope: "c",
                                                  connector: ["Flowchart", { stub: 5 }],
                                                  endpointStyle: {
                                                  radius: 5
                                                  },
                                                  dragOptions: {
                                                  cursor: 'crosshair'
                                                  }
                                               });

Answer 1

I solve it!!! this is modified code:

var connection2block = jsPlumb.connect({
                                              uuids: ["block2_BottomCenter", "block1_TopCenter"],
                                              detachable: true,
                                              fireEvent: true,
                                              scope: "c",
                                              connector: ["Flowchart", { stub: 5 }],
                                              endpointStyle: {
                                              radius: 5
                                              },
                                              dragOptions: {
                                              cursor: 'crosshair'
                                              }
                                           });