JSFiddle - React, Tailwind, and code Playground

HTML

<h1>JQuery selector issue</h1>
<hr />
<br />
<p>In order to work this example requires Firefox with Firebug extension having Console tab enabled. </p>
<br />
<form id="form1" class="test">
    <p>Any input element with attribute "name" who's value is "id" placed between the opening and closing form tags corrupts the returned selectors.</p>
    <input type="hidden" name="id" value="0" />
</form>
<br /><br />
<form id="form2" class="test">
    <p>No input element with @name="id"</p>
</form>

Expected firebug output: <br />
<b>[form#form1.test, form#form2.test]</b>

What is actually returned<br />
<b>[form#[object HTMLInputElement].test, form#form2.test]</b>

JavaScript

console.log($('form'));