Difference between jQuery’s .hide() and setting CSS to display: none

Question

Which am I better off doing? .hide() is quicker than writing out .css(\"display\", \"none\"), but what’s the difference and what are both of them a

Answer 1

They are the same thing. .hide() calls a jQuery function and allows you to add a callback function to it. So, with .hide() you can add an animation for instance.

.css("display","none") changes the attribute of the element to display:none. It is the same as if you do the following in JavaScript:

document.getElementById('elementId').style.display = 'none';

The .hide() function obviously takes more time to run as it checks for callback functions, speed, etc...