Load, change and remove parts of loaded GLTF by name from scene in three.js

I want to remove a part of a GLTF. I already have a name.

var Muffler = scene.getObjectByName("muffler");

console.log(Muffler);

The console shows me the right Object.

I can also change the visibility with:

Muffler.visible = false;

but the Code:

scene.remove(Muffler);

is doing nothing.

What can be the problem?

This code does only work for direct children of scene. Try it like so instead:

const parent = Muffler.parent;
parent.remove( Muffler );

Works perfect.

Now i am loading my Standard-GLTF on Start.

loader.load( 'models/Original.gltf', gltf => onLoad( gltf));

and after i click on one of my links to choose the Muffler

<a class="mufflerlink" data-muffler="Original">Original</a>
<a class="mufflerlink" data-muffler="Tuning">Tuning</a>

it changes the part

$( ".mufflerlink" ).each(function(index) {
	$(this).on("click", function(){

		var Muffler = scene.getObjectByName("muffler");
		const parentMuffler = Muffler.parent;
		parentMuffler.remove( Muffler );

		var chosedMuffler = $(this).data("muffler");

		loader.load( 'models/' + chosedMuffler + '.gltf', gltf => onLoad( gltf));

	});
});

For all other guys. I had to name the Object “muffler” in Blender.

Thanks a lot @Mugen87!

And yes, to much Muffler in my Code! :wink: