JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <form id="foo" onsubmit="return false;">
        <button id="target" onclick="console.log('parent form', this.form.id); console.log('sibling', areallyuniquename.getAttribute('expando'));">What is my scope?</button>
        <button id="areallyuniquename" expando="initialForm">I'm a bar</button>
    </form>
</div>
<form id="container2" onsubmit="return false;">
        <button id="areallyuniquename" expando="secondForm">I'm also a bar</button>
</form>

<button onclick="ChangeButtonScope();">Change Scope of Button</button>

<script>
    function ChangeButtonScope() {
    document.getElementById("container2").appendChild(document.getElementById("target"));
    document.getElementById("foo").parentNode.removeChild(document.getElementById("foo"));
}
</script>