How to delete composite child nodes from a VBox when the event occurs in the composite child itself?

Question

I have a root node of VBox. I also have a composite node that created using Pane and button within it. Multiple Instances of the composite node are added to the VBox. I tried to find a way to remove each composite node when its inner button is fired. But i failed to finding a way. Here is my code, Can anybody help me please?

@Override
public void start(Stage primaryStage) {
    VBox root = new VBox();
    root.setAlignment(Pos.TOP_CENTER);
    root.setSpacing(10);

    Scene scene = new Scene(root, 300, 700);

    primaryStage.setTitle("Hello World!");
    primaryStage.setScene(scene);
    primaryStage.show();

    // 10 Non reffered instances will be added to the VBox(root)
    for (int i=0; i<10; i++) {
        Pane compositeChild = new Pane();
        compositeChild.setPrefWidth(300);
        compositeChild.setPrefHeight(40);
        compositeChild.setBorder(new Border(new BorderStroke(Color.CORAL, BorderStrokeStyle.SOLID, CornerRadii.EMPTY, BorderWidths.DEFAULT)));
        Button btn = new Button("Delete Me");
        btn.setPrefWidth(200);
        btn.setPrefHeight(30);
        btn.setLayoutX(50);
        btn.setLayoutY(5);

        // I want to find some code for below action event
        btn.setOnAction(e2 -> {
            //how can I remove only one compositeChild that the event fired From the root(VBox)
            ((Button)e2.getSource()).setText("I should be deleted??");
        });

        compositeChild.getChildren().add(btn);
        root.getChildren().add(compositeChild);
    }
}

Answer 1

Just do

btn.setOnAction(e2 -> {
    root.getChildren().remove(compositeChild);
});