Code has been added to clipboard!

jQuery .prop(): Set or Get Element Properties and Values

Reading time 1 min
Published Jan 22, 2018
Updated Oct 1, 2019

jQuery prop: Main Tips

  • jQuery .prop() method returns the property value of the first matched element.
  • .prop() jQuery can also set properties for elements.
  • To remove the properties set with this method, use jQuery .removeProp().

Using .prop()

The jQuery .prop() function gets or sets the property value of the selected element. The function returns undefined if the value for a property is not assigned.

In the example, clicking a button changes the property value of checkboxes:

Example
$("button").click(() => {
    $("input[type='checkbox']").prop({
        disabled: false
    });
});

Tip: you can get values of each element by using .each() or .map() functions.

Follow this jQuery .prop() syntax to return the specified property's value:

$("selector").prop(property);

Note: the property is defined by a string.

Now this syntax is used to set a value for one property:

$("selector").prop(property, newValue);

You can also add a function returning the value needed as the newValue.

To set values for multiple elements using .prop() jQuery method, put them in pairs:

$("selector").prop(property:value, property:value, ...);

Note: use .prop()) in jQuery to set tagName, nodeType, selectedIndex, nodeType, etc. They cannot be set with .attr() since jQuery 1.6.

Learn jQuery
Introduction
Selectors
Events
Event Methods
Download
Callback
Chaining
Get and Set
Add Element
Remove Element
Traverse
Parent
Children
Sibling Traverse
Filtering
jQuery AJAX
Effects
Show and Hide
Fade Effect
Slide Effect
Animate Effect
Manipulate CSS
Width and Height
.addClass()
.after()
.animate()
.append()
.appendTo()
.attr()
.before()
.bind() (deprecated)
.blur()
.change()
.click()
.clone()
.css()
.dblclick()
.delay()
.delegate() and .undelegate() (deprecated)
.detach()
.empty()
.end()
.error() (deprecated)
.fadeIn()
.fadeOut()
.fadeTo()
.fadeToggle()
.finish()
.focus()
.focusIn()
.focusOut()
.hasClass()
.height()
.hide()
.hover()
.html()
.innerHeight()
.innerWidth()
.insertAfter()
.insertBefore()
.keypress()
.keyup()
.live() and .die() (deprecated)
.load() (deprecated)
.mousedown()
.mouseenter()
.mouseleave()
.mousemove()
.mouseout()
.mouseover()
.mouseup()
.off()
.offset()
.offsetParent()
.on()
.one()
.outerHeight()
.outerWidth()
.position()
.prepend()
.prependTo()
.prop()
.proxy()
.queue()
.ready()
.remove()
.removeAttr()
.removeClass()
.removeProp()
.replaceAll()
.replaceWith()
.resize()
.scroll()
.scrollLeft()
.scrollTop()
.show()
.slideDown()
.slideToggle()
.slideUp()
.stop()
.submit()
.text()
.toggle()
.toggleClass()
.trigger()
.triggerHandler()
.unbind() (deprecated)
.unload() (deprecated)
.unwrap()
.val()
.width()
.wrap()
Event Properties
event.currentTarget
event.preventDefault()
event.relatedTarget
event.stopImmediatePropagation()
event.stopPropagation()
event.target
event.timeStamp
event.type
event.which
jQuery .find()
jQuery .keydown()
jQuery.noConflict()
pageY and pageX