How to remove/replace mesh from an object in three.js?

Question

JavaScript

Sample code:

...
var grounds = new THREE.Object3D();
scene.add(grounds);
for (var i = 0; i < 5; i++) {
var mat = new THREE.MeshPhongMaterial({
                ambient: 0x888888,
                color: 0xffffff,
                shininess: 30,
                shading: THREE.FlatShading
            });
var geom = new THREE.BoxGeometry(200,200,200);
var mesh = new THREE.Mesh(geom ,mat);
mesh.name = "n-"+i
grounds.add(mesh);
}

Found various options, but it all boils down to one thing: scene.remove( object ), for example:

var selectedObject = scene.getObjectByName(object.name);
    scene.remove( selectedObject );

As a result, it is possible to remove the entire Object3d (grounds in this case), but not the mesh, although it is found via scene.getObjectByName().

Answer 1

And why not make it so that there is only one mesh per object, and combine objects hierarchically? So, it will be necessary to delete not the mesh, but the objects from the parent object.
At least that's what I did in my editor.