#    
## Overview
In this shot, we will learn how to use the DOM property to get or set the `title` of any element.

The DOM **`title`** property provides us a way to get the `title` when applied to the HTML element. We can also use `title` to set the title of the HTML element. 

> When you give a title to an element, you need to assign a value to the `element.title` property.


## Code
Let's use the `title` property on a `p` tag and give it a title.

<!DOCTYPE html>
<html>
<body>

<p>To find the title of the below p element click the button.</p>

<p id="elem" title="javascript">>>JS</p>

<button onclick="change()">Try it</button>

<script>
function change() {
  var x = document.getElementById("elem")
  var y = x.title;
  console.log(y);
}
</script>

</body>
</html>


codemirror

console

#   
## Code explanation
* In line `5`, we have a `P` element with text to display.

* In line `7`, we have a paragraph tag with id `elem` and a `title` attribute.

* In line `9`, we write a button tag with a `change()` function, which will be called when the user clicks on it.

* In line `12`, we write the JavaScript code in the script tag. We define a `change()` function that will be called after a click from the HTML page.

* In line `13`, we use `document.getElementById()` and pass id `elem` in the `change()` function to get the `p` element and get the element object.

* In line `14`, we apply the `title` property on the element object we get above and store the return value in a variable.

* In line `15`, we print the value returned by the `title` property on the console. 

## Output

When we click the button, the console prints the title we assigned to the `p` element with id `elem`.
We have successfully used the `title` property.

What is the DOM title property?

The DOM title property retrieves or sets an HTML element's title, enabling dynamic title management via JavaScript.