JSFiddle - React, Tailwind, and code Playground

HTML

<input id="foo1" type="text" />
<input id="foo2" autofocus type="text" />
<input id="foo3" autofocus type="text" />

JavaScript

$("body").append('<p>$("input[autofocus]:first").size(): '+$("input[autofocus]:first").size()+'</p>');
$("body").append('<p>$("input[autofocus]:first").attr("id"): '+$("input[autofocus]:first").attr("id")+'</p>');
$("body").append('<p>$("input:first").size(): '+$("input:first").size()+'</p>');
$("body").append('<p>$("input:first").attr("id"): '+$("input:first").attr("id")+'</p>');
$("body").append('<p>$("input[autofocus]").size(): '+$("input[autofocus]").size()+'</p>');