jQuery implementiert verschachtelte Tab-Funktion

<Text>
<div id="div1">
 <input Klasse="aktiv" Typ="Schaltfläche" Wert="Tab1" />
    <Eingabetyp="Schaltfläche" Wert="Tab2" />
    <Eingabetyp="Schaltfläche" Wert="Tab3" />
    <Eingabetyp="Schaltfläche" Wert="Tab4" />
    <Eingabetyp="Schaltfläche" Wert="Tab5" />
</div>
<div Klasse="box1" Stil="Anzeige:Block;">
 <div Klasse="box2" Stil="Anzeige:Block;">
     Registerkarte1-1
    </div>
    <div Klasse="Box2">
     Registerkarte1-2
    </div>
    <div Klasse="Box2">
     Registerkarte1-3
    </div>
    <input Klasse="aktiv" Typ="Schaltfläche" Wert="Tab1-1" />
    <Eingabetyp="Schaltfläche" Wert="Tab1-2" />
    <Eingabetyp="Schaltfläche" Wert="Tab1-3" />
</div>
<div Klasse="Box1">
 <div Klasse="box2" Stil="Anzeige:Block;">
     Registerkarte2-1
    </div>
    <div Klasse="Box2">
     tab2-2
    </div>
    <div Klasse="Box2">
     Registerkarte2-3
    </div>
    <input Klasse="aktiv" Typ="Schaltfläche" Wert="tab2-1" />
    <Eingabetyp="Schaltfläche" Wert="Tab2-2" />
    <Eingabetyp="Schaltfläche" Wert="Tab2-3" />
</div>
<div Klasse="Box1">
 <div Klasse="box2" Stil="Anzeige:Block;">
     Registerkarte3-1
    </div>
    <div Klasse="Box2">
     Registerkarte 3-2
    </div>
    <div Klasse="Box2">
     Registerkarte3-3
    </div>
    <input Klasse="aktiv" Typ="Schaltfläche" Wert="tab3-1" />
    <Eingabetyp="Schaltfläche" Wert="Tab3-2" />
    <Eingabetyp="Schaltfläche" Wert="Tab3-3" />
</div>
<div Klasse="Box1">
 <div Klasse="box2" Stil="Anzeige:Block;">
     Registerkarte4-1
    </div>
    <div Klasse="Box2">
     Registerkarte4-2
    </div>
    <div Klasse="Box2">
     Registerkarte4-3
    </div>
    <input Klasse="aktiv" Typ="Schaltfläche" Wert="tab4-1" />
    <Eingabetyp="Schaltfläche" Wert="Tab4-2" />
    <Eingabetyp="Schaltfläche" Wert="Tab4-3" />
</div>
<div Klasse="Box1">
 <div Klasse="box2" Stil="Anzeige:Block;">
     Registerkarte 5-1
    </div>
    <div Klasse="Box2">
     tab5-2
    </div>
    <div Klasse="Box2">
     Registerkarte 5-3
    </div>
    <input Klasse="aktiv" Typ="Schaltfläche" Wert="tab5-1" />
    <Eingabetyp="Schaltfläche" Wert="Tab5-2" />
    <Eingabetyp="Schaltfläche" Wert="Tab5-3" />
</div>
</body>

 <script src="js/js.js"></script>
    <Skript>
        $('#div1>:button').on('klicken', function(){
            $(this).addClass('aktiv').siblings().removeClass('aktiv');
 
            // Der Index der angeklickten Schaltfläche in der roten Schaltfläche let i = $(this).index();
            $('.box1').eq(i).anzeigen().siblings('.box1').hide();
 
        });
 
        $('.box1>:button').on('klicken',function(){
            $(this).addClass('aktiv').siblings('Eingabe').removeClass('aktiv');
            // Der Index der drei Eingaben derselben Generation wie die angeklickte Schaltfläche let i = $(this).parent().find('input').index(this);
            $(diese).parent().find('div').eq(i).show().siblings('div').hide();
        })