YouTip element with class="demo":
var x = document.getElementById("myDIV"); x.querySelector(".demo").innerHTML = "Hello World!";
[Try it »](#)
## Definition and Usage
The querySelector() method returns the first child element that matches a specified CSS selector within an element.
**Note:** The querySelector() method only returns the first element that matches the specified selector. If you want to return all matching elements, use the querySelectorAll() method instead.
For more CSS selectors, visit our (#) and our (#).
* * *
## Browser Support
The numbers in the table specify the first browser version that fully supports the method.
| Method | | | | | |
| --- | --- | --- | --- | --- | --- |
| querySelector() | 4.0 | 8.0 | 3.5 | 3.1 | 10.0 |
* * *
## Syntax
_element_.querySelector(_CSS selector_)
## Parameter Values
| Parameter | Type | Description |
| --- | --- | --- |
| _CSS selector_ | String | Required. Specifies one or more CSS selectors to match elements. Elements can be selected by their id, class, type, attributes, attribute values, etc. For multiple selectors, separate them with a comma. Returns a single matching element. **Tip:** For more CSS selectors, see our (#). |
## Technical Details
| DOM Version: | Selectors Level 1 Element Object |
| --- |
| Return Value: | The first element matching the specified CSS selector. Returns null if no match is found. Throws a SYNTAX_ERR exception if an invalid selector is specified. |
* * *
## More Examples
## Example
Change the content of the first
element inside the
element:
var x = document.getElementById("myDIV");
x.querySelector("p").innerHTML = "Hello World!";
[Try it »](#)
## Example
Change the content of the first child element with class="example" inside the
element:
var x = document.getElementById("myDIV");
x.querySelector(".example").innerHTML = "Hello World!";
[Try it »](#)
## Example
Change the content of the first
element with class="example" inside the
element:
var x = document.getElementById("myDIV");
x.querySelector("p.example").innerHTML = "Hello World!";
[Try it »](#)
## Example
For the first element with a target attribute inside the
element: