title: jsPlumb remove endpoints on connection detached
body: <p>I'm creating a matching widget of two columns using jsPlumb.</p>
  
  <p>The jsPlumb instance is created as :</p>
  
  <pre><code>var container = $element.find('.match-widget .widget-output:not(.edit)');
  
  jsPlumb.getInstance({
          PaintStyle: {
            lineWidth: 6,
            strokeStyle: '#567567',
            outlineColor: 'black',
            outlineWidth: 1
          },
          MaxConnections: -1,
          LogEnabled: true,
          Anchors: ['Center', 'Center'],
          DragOptions: {
            cursor: 'pointer',
            zIndex: 2000
          },
          Connector: ['Bezier', {
            curviness: 30
          }],
          Endpoints: [
            ['Dot', {
              radius: 11
            }],
            ['Dot', {
              radius: 11
            }]
          ],
          EndpointStyles: [{
            fillStyle: '#FF7D19'
          }, {
            fillStyle: '#FF7D19'
          }],
          Container: container
  });
  </code></pre>
  
  <p>I've created the source and target like:</p>
  
  <pre><code>jsPlumb.makeSource($(element[0]).find('.match-source-anchor')[0], {
      maxConnections: 1,
      uniqueEndpoint: true,
      isSource: true,
      enabled: true
   });
  
   jsPlumb.makeTarget($(element[0]).find('.match-target-anchor')[0], {
      uniqueEndpoint: true,
      isTarget: true,
      maxConnections: 1,
      enabled: true
   });
  </code></pre>
  
  <p>The connection process works properly. But the issues after making one connection if I remove the connection, the connection end point is still visible. </p>
  
  <p>I tried to add the config "_deleteOnDetach" and I also tried to delete the endpoint on the connectionDetach. In both cases the end point is removed but in I try to connect the same element then it gets error.</p>
  
  <p>So can anybody please help me how to fix it?</p>
  
  <p>Demo : <a href="https://jsfiddle.net/jyp994et/11/" rel="nofollow noreferrer">jsfiddle</a></p>