two rectangle is concate to each other in Kinetic.Rect method using kinectic jquery file

Question

In my task I am creating and resizing the rectangle by a button click event using Kinetic.Rect({ ..... }) method.

Now, here when I am clicking once time button at that time rectangle is created and also resizing in the div whose id is container.

But when again I am clicking button to create second rectangle at that time it was creating the rectangle but it is concate to the first rectangle i.e. when I am resize the second rectangle at that time the first rectangle is resizing which second is not effect, also when I am drag the second rectangle at that time second as well as first rectangle also dragging instantly.

So, I dont know that why it is happening.

Let's see the task image for more clear

Here is the first image of the task in which I click the button one time for create the rectangle in the container div.

Now, In the first image, It show at one time button click it create the one rectangle to the container div.

In the second image, it shows at second time button click it creates the second rectangle to the container div.

In the third image, it shows the when drag the second rectangle at that time the first rectangle also move the same way as the second one. Also, at the second time when second rectangle is resizing at that time first rectangle is resizing not second.

Here is my code,

//This click function is for create rectangle shape
$("#textsubmitShape").live("click",function(){  
    addRect ();
});

function addRect()
{
    var rectShape;
    rectShape = new Kinetic.Rect({
                    x:0,
                    y:0,
                    width: 300,
                    height:120,
                    strokeWidth: 2,
                     stroke: "red",
                     name: "rect"
      });

rectShape.on("mouseover", function() {
                     var layer = this.getLayer();
                     document.body.style.cursor = "cursor";
                     this.setStrokeWidth(0);
                      this.setStroke("pink");
                      writeMessage(messageLayer, "Double Click To Remove");
                     layer.draw();                   
                 });
rectShape.on("mouseout", function() {
                     var layer = this.getLayer();
                     document.body.style.cursor = "default";
                     this.setStrokeWidth(0);
                      this.setStroke("pink");
writeMessage(messageLayer, " ");
                      layer.draw();
                 });                 
var messageLayer = new Kinetic.Layer();
        stage.add(messageLayer);
                darthVaderGroup.add(rectShape);
                addAnchor(darthVaderGroup, 0, 0, "topLeft");
                addAnchor(darthVaderGroup, 300, 0, "topRight");
                addAnchor(darthVaderGroup, 300, 120, "bottomRight");
                addAnchor(darthVaderGroup, 0, 120, "bottomLeft");
                addAnchor(darthVaderGroup, 0, 120, "bottomLeft");

      rectShape.on("dblclick", function(){
                var shapesLayer=this.getLayer();
 darthVaderGroup.remove(rectShape);
 shapesLayer.clear();
   });
}