element[attribute='value' - Attribute equals to in jQuery

How to select elements based on their attribute value?

To select all elements based on their specific attribute value, we can use attribute selector in jQuery.

    <input id="txtName" type="text" data-id="txt Name" />
    <input id="FirstNameF" type="text" data-id="name txt" />
    <input type="button" value="Button" id="btnTest" />

    <script>
        $(function () {
            $("input[type='text']").css("border", "1px solid red");
        });
    </script>

Notice the selector part of the jQuery code, we have used type='text' that instruct jQuery to select only those elements from the page whose type attribute is equal to "text".

This will select first two elements and apply border 1px solid and red color.

Output