JSFiddle - React, Tailwind, and code Playground

HTML

<div id="test">
    <input type="text" value="text text" name="text">
    <br>
    <select name="single">
        <option>Single</option>
        <option>Single2</option>
    </select>
    <br />
    <select name="multiple" multiple="multiple">
        <option selected="selected">Multiple</option>
        <option>Multiple2</option>
        <option selected="selected">Multiple3</option>
    </select>
    <br/>
    <input type="checkbox" name="check" value="check1" id="ch1" />
    <label for="ch1">check1</label>
    <input type="checkbox" name="check" value="check2" checked="checked" id="ch2" />
    <label for="ch2">check2</label>
    <br />
    <input type="radio" name="radio" value="radio1" checked="checked" id="r1" />
    <label for="r1">radio1</label>
    <input type="radio" name="radio" value="radio2" id="r2" />
    <label for="r2">radio2</label>
    <br>
    <textarea name="textarea">textarea text</textarea>
    <br>
    <input type="password" name="password" value="secret">
    <br>
    <input type="button" value="i'm a button don't serialize me dude">
    <br>
    <p>some random &lt;p> tag which is not serialized</p>
</div>

JavaScript

console.time("'find' method");
$("#test").find("select, textarea, input").serialize();
console.timeEnd("'find' method");
console.time("':input' method");
$("#test :input").serialize();
console.timeEnd("':input' method");