if (!this.querySelector('input')) {
this.innerHTML = `<input type="text" value="${this.innerText}">`;
}
<label for="tab1">tab1 button</label><br>
<label for="tab2">tab2 button</label><br>
<label for="tab3">tab3 button</label><br>
<div class="tab">
<input type="radio" name="tabRadio" id="tab1" class="tab__radio">
<div class="tab__content">tab1 content</div>
</div>
<div class="tab">
<input type="radio" name="tabRadio" id="tab2" class="tab__radio">
<div class="tab__content">tab2 content</div>
</div>
<div class="tab">
<input type="radio" name="tabRadio" id="tab3" class="tab__radio">
<div class="tab__content">tab3 content</div>
</div>
<style>
.tab .tab__radio,
.tab .tab__content {
display: none;
}
.tab .tab__radio:checked + .tab__content {
display: block;
}
</style>