The off method in jQuery

Unbinding events bound via on is done using the off method. Its first parameter is the event type (e.g. 'click') and the second is the name of the function to unbind.

Let's look at the following example. Let's say we have HTML code:

<ul>
	<li>text</li>
	<li>text</li>
	<li>text</li>
</ul>

The CSS specifies the style for the li tag:

li {
	width: 100px;
	cursor: pointer;
}

Let's make it so that after the first click on li, the event is unbound from it:

$('li').on('click', function() {
	$(this).append('!');
	$(this).off('click', func);
});

Click on the list items. You will see that when you click on the same list item again, nothing happens, because our function func after executing the method append is unbound by the method off.

Bind an event to all links - when you hover over a link, its href is added to the end of its text in parentheses. After the first hover over a link, you should unbind the event from it, which adds href to the end of the text.

For all inputs, make them output their value alert when you click on any of them, but only on the first click. Clicking on the input again should not cause a reaction.

Given paragraphs with numbers. When you click on a paragraph, the square of the number it contains should appear in it, but only on the first click. When you double-click on a paragraph, the number in the paragraph should double, but also only the first time.