How to set a CSS value from an Attribute in JQuery

Question

I need to set an element's background color from an attribute. At the current moment I am trying:

$( '[myAttr]' ).css( 'background-color', $( this ).attr( 'myAttr' ) );

but $( this ).attr( 'myAttr' ) is returning undefined.

Is there a way to do this?

Post your html and script. this probably isn't referring to what you think it is referring to. — jumbopap
– jumbopap, Commented Jan 10, 2016 at 18:10
Provide the code snippet as it is yet not clear what this is referring. — amitguptageek
– amitguptageek, Commented Jan 10, 2016 at 18:13

Josh Crozier · Accepted Answer · 2016-01-10 18:17:39Z

1

In your example, this doesn't refer to the [myAttr] element because there is no scope.

You could pass an anonymous function (so that you have access to this), and return the attribute value:

$('[myAttr]').css('background-color', function () {
  return $(this).attr('myAttr');
});

answered Jan 10, 2016 at 18:17

Josh Crozier

242k56 gold badges401 silver badges316 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

demux · Accepted Answer · 2016-01-10 18:17:50Z

0

this is not relevant outside of a callback. Do something like this...

$('[myAttr]']).each(function() {
  $(this).css('background-color', $(this).attr('myAttr'))
})

answered Jan 10, 2016 at 18:17

demux

4,6742 gold badges36 silver badges59 bronze badges

Ibrahim Khan · Accepted Answer · 2016-01-10 18:18:16Z

0

this probably isn't referring the element. Try like below.

var elm = $('[myAttr]');
elm.css('background-color', elm.attr('myAttr'));

answered Jan 10, 2016 at 18:18

Ibrahim Khan

20.8k7 gold badges46 silver badges57 bronze badges