---
title: "Explain the difference between fadeOut() and hide() methods in jQuery."  
description: "Explain the difference between fadeOut() and hide() methods in jQuery."  
author: "Revati S Misra"  
published: 2023-07-16  
updated: 2023-07-17  
canonical: https://www.mindstick.com/forum/159116/explain-the-difference-between-fadeout-and-hide-methods-in-jquery  
category: "jquery"  
tags: ["jquery", "jquery plugins"]  
reading_time: 2 minutes  

---

# Explain the difference between fadeOut() and hide() methods in jQuery.

[Explain the difference](https://www.mindstick.com/forum/156125/can-you-explain-the-difference-between-organic-and-paid-results) between fadeOut() and hide() [methods in jQuery](https://www.mindstick.com/forum/156658/use-of-first-and-last-methods-in-jquery).

## Replies

### Reply by Aryan Kumar

Sure. The `fadeOut()` and `hide()` [methods](https://www.mindstick.com/articles/13060/runny-nose-remedy-methods-that-work-best) in jQuery are both used to hide an element, but they do so in different ways.

The `fadeOut()` method gradually fades out the element, over a specified duration. The element is still present in the DOM, but its opacity is reduced to 0. The `hide()` method, on the other hand, immediately hides the element. The element is removed from the DOM, and it is no longer visible.

Here is an example of how to use the `fadeOut()` method:

```plaintext
$('.myElement').fadeOut(500);
```

This code will fade out the element with the class `myElement` over a duration of 500 milliseconds.

Here is an example of how to use the `hide()` method:

```plaintext
$('.myElement').hide();
```

This code will immediately hide the element with the class `myElement`.

The `fadeOut()` method is often used when you want to create a fading effect, such as when you are revealing a new section of a web page. The `hide()` method is often used when you want to hide an element temporarily, such as when you are displaying a modal dialog.

Here is a table that summarizes the key differences between the `fadeOut()` and `hide()` methods:

| Feature | `fadeOut()` | `hide()` |
| --- | --- | --- |
| Effect | Fades out the element over a specified duration | Immediately hides the element |
| Element is still present in the DOM | Yes | No |
| Can be used to create a fading effect | Yes | No |
| Often used for | Revealing new sections of a web page | Hiding elements temporarily |


---

Original Source: https://www.mindstick.com/forum/159116/explain-the-difference-between-fadeout-and-hide-methods-in-jquery

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
