I want to set all items of specific class to a specific value, but IF it has a specific attribute set, it must match a condition.

Example:

<div class="address"></div>
<div class="address" data-address-type="from"></div>
<div class="address" data-address-type="to"></div>

I want to set all address to "123 Some Address Road". However, if there is a data-address-type, only if the data-address-type is "to".

$('.address[data-address-type="to"]').text('123 Some Address Road');

The above will not change the elements where data-address-type is not defined.

I want to set all items of specific class to a specific value, but IF it has a specific attribute set, it must match a condition.

Example:

<div class="address"></div>
<div class="address" data-address-type="from"></div>
<div class="address" data-address-type="to"></div>

I want to set all address to "123 Some Address Road". However, if there is a data-address-type, only if the data-address-type is "to".

$('.address[data-address-type="to"]').text('123 Some Address Road');

The above will not change the elements where data-address-type is not defined.

• javascript
• jquery
• jquery-selectors

• There are no conditional selectors. Use the .filter() method. – Barmar Commented Oct 31, 2013 at 4:51
• 1 try jsfiddle/arunpjohny/nSW7L/1 – Arun P Johny Commented Oct 31, 2013 at 4:58
• You need quotes around the 'to' - they have to be different than the apostrophe you use around the whole selector. Change it to "to" and try that. – Trojan Commented Oct 31, 2013 at 5:01
• Ty @trojansdestroy - That was a typo though... fixed! – Bradley Commented Oct 31, 2013 at 5:10

3 Answers 3

You need to use a filter() for this, in .address elements filter elements which either does not have the data-address-type attribute using :not([data-address-type]) or data-address-type has the value to using [data-address-type="to"]

$('.address').filter(':not([data-address-type]), [data-address-type="to"]').html('')

Demo: Fiddle

Try this:

[data-address-type='to'] means attribute data-address-type having value equal to to.

$(".address[data-address-type='to'],.address:not([data-address-type])").text("123 Some Address Road");

Fiddle here.

More information here.

Use a bination of $(".address") and the Attribute Equals Selector or Attribute Not Equal Selector.