The jQuery width() method is used to GET/SET the width for the selected element. In simple, width () method can be split in to two purposes

  • GET width : It will return the width for the selected/matched element
  • SET width : It will set the width for the selected/matched element


  • $(selector).width ()
  • $(selector).width (value)
  • $(selector).width (function(index,currentwidth ))
Value   It specifies the width in px, pt, em, etc. In default it treat as px.
function(index,currentclass) A function that returns one or more class names to remove
index : Returns the index position of the matched element
currentclass : Returns the current class name of the matched element

Difference between .css(“width”) & .width():

.css( “width” ) : It will returns with unit value (for example, 200px)
.width() : It return with units less (for example, 200).

When to use?

If we need to perform some mathematical calculation based on the element’s width then we can use .width() method.



Clicking on button, the .width (80) method will  execute and set 80 for the selected element and .width () method will GET the width of the selected div as shown below .