Modify value of attribute

Question

How to modify the value of data-tooltip? I would like to do that with one line of code.

Here is the element:

<li class="ui-btn-icon-left " data-icon="cf">
  <a href="#" class="ui-btn ui-icon-cf">
    <span class="tooltip" data-tooltip="NeverGiveUp">Samaras</span>
  </a>
</li>

Here are two of my attempts:

$($(li).find('a').find('span').attr('data-tooltip')).val('foo');
$($(li).find('a').find('span').attr('data-tooltip')).text('foo');

which had no impact.

score 2 · Answer 1 · answered Sep 28 '15 at 16:05

2

The shortest notation would be:

$('li a span').data('tooltip', 'foo');

answered Sep 28 '15 at 16:05

MaxZoom

7,619
5
28
44

hjpotter92 · Answer 2 · 2015-09-28T16:22:45.893

1

I assume you want to do the following:

$('li a').find('span').data('tooltip', 'foo');

edited Sep 28 '15 at 16:22

answered Sep 28 '15 at 16:01

hjpotter92

78,589
36
144
183

Thank you very much, +1 for the complete answer. – gsamaras Sep 28 '15 at 16:03
@gsamaras Ah! It would be `,`. Typing on a new keyboard. – hjpotter92 Sep 28 '15 at 16:23

score 1 · Answer 3 · answered Sep 28 '15 at 16:01

1

Use .data():

$($(li).find('a').find('span').data('tooltip', 'foo'));

answered Sep 28 '15 at 16:01

Mario Pabon

605
4
8

JCOC611 · Accepted Answer · 2015-09-28T16:10:17.923

1

Well the straight forward answer is .attr('data-tooltip', 'new value');. However, it is also possible, and more recommended (see hjpotter92's comment), to use .data('tooltip', 'new value');

edited Sep 28 '15 at 16:10

answered Sep 28 '15 at 16:01

JCOC611

19,111
14
69
90

Two methods suggested, very nice! And the question is: which one should I use? Are they equivalent? What what would you suggest? – gsamaras Sep 28 '15 at 16:06
Thank @hjpotter92. JCOC611, you should update your answer with the gist of the link that jhpotter92 kindly provided, in order to make clear why we should prefer the one method over the other. That way your answer will be far better! – gsamaras Sep 28 '15 at 16:15
I am accepting this answer, because `.attr()` approach was the one that really worked in my actual application. – gsamaras Sep 28 '15 at 16:26

score 1 · Answer 5 · answered Sep 28 '15 at 16:05

1

I think you can simplify that to:

$("li a span").data("tooltip", "foo");

answered Sep 28 '15 at 16:05

sockmonk

4,195
24
40

score 1 · Answer 6 · edited Sep 28 '15 at 16:13

1

For HTML 5 data-attributes, you can use data()

$($(li).find('a').find('span').data('tooltip', 'foo'));

edited Sep 28 '15 at 16:13

gsamaras

71,951
46
188
305

answered Sep 28 '15 at 16:13

user3753202

517
7
14

Thank you, however, such kind of an answer is already provided. Next time, you will have to be faster! :) – gsamaras Sep 28 '15 at 16:14

score 1 · Answer 7 · answered Sep 28 '15 at 16:49

1

Use simple with data-attribute

$('.tooltip[data-tooltip]').data('tooltip', 'foo');

answered Sep 28 '15 at 16:49

Đặng Văn Thanh

558
5
7

Modify value of attribute

7 Answers7