---
title: "How to select the first occurring element after another element?"  
description: "How to select the first occurring element after another element?"  
author: "Steilla Mitchel"  
published: 2023-07-21  
updated: 2023-07-21  
canonical: https://www.mindstick.com/forum/159204/how-to-select-the-first-occurring-element-after-another-element  
category: "html"  
tags: ["jquery selectors", "html input"]  
reading_time: 2 minutes  

---

# How to select the first occurring element after another element?

How to [select](https://www.mindstick.com/forum/160534/orderby-then-select-vs-select-then-orderby-performance) the first occurring element after another element?

## Replies

### Reply by Aryan Kumar

To select the first occurring element after another element, you can use the `+` selector in CSS. The `+` selector matches an element that is immediately preceded by another element. For example, the following CSS will select the first `p` element that is immediately after an `h1` element:

CSS

```plaintext
h1 + p {
  color: red;
}
```

Here is an example of how you can use the `+` selector to select the first occurring element after another element in HTML:

HTML

```plaintext
<h1>This is the heading</h1>
<p>This is the first paragraph</p>
<p>This is the second paragraph</p>
```

The following CSS will set the color of the first `p` element after the `h1` element to red:

CSS

```plaintext
h1 + p {
  color: red;
}
```

This will change the color of the first `p` element to red, but will not affect the other `p` elements.

You can also use the `+` selector to select all of the elements that are immediately after another element. For example, the following CSS will select all of the `p` elements that are immediately after an `h1` element:

CSS

```plaintext
h1 + p {
  color: red;
}
```

Here is an example of how you can use the `+` selector to select all of the elements that are immediately after another element in HTML:

HTML

```plaintext
<h1>This is the heading</h1>
<p>This is the first paragraph</p>
<p>This is the second paragraph</p>
```

This CSS will set the color of all of the `p` elements to red.


---

Original Source: https://www.mindstick.com/forum/159204/how-to-select-the-first-occurring-element-after-another-element

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
