The **`closest()` method** is a built-in method in jQuery. This method looks for the first ancestor of the element by traversing upward from the current element. A successful search returns the element itself; otherwise​, a null is returned.

# Syntax

```javascript
$(selector).closest([selector])
```

> More about selectors can be found [here](https://www.educative.io/shoteditor/6448145208705024/preview).

# Code
In the code below, the `closest()` method will start searching for the first ancestor *from* the span element and change its border color from black to red.

<html> 

<head> 
	<style> 
		.body * { 
			display: block; 
			border: 2px solid black; 
			color: grey; 
			margin: 35px; 
		} 
	</style> 
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">  
		</script>
        <script>
        $(document).ready(function() { 
			$("span").closest("ul").css( "border-color", "red" ); 
		} );
	</script> 
</head> 

<body class="body"> 
		<ul> 
			Second ancestor element  
			<ul> 
				First ancestor element  
				<li>  Parent element 
				<span>Hello World</span> 
				</li> 
			</ul> 
		</ul> 
</body> 
</html> 

codemirror

What is the jQuery closest() method?

The jQuery closest() method finds the first ancestor of an element and can modify it.