CODEWITHSUNDEEP
javascriptcssreactjs
Cameron Godwin
Cameron Godwin

Reputation: 54

How to change the style of an element retrieved from JS getelementbyid in react?

I'm trying to target an element in the the DOM that has already been returned, and rendered, by another component; I was hoping to use a getElementById() call, and then change the CSS of that element.

Upvotes: 1

Views: 4398

Answers (3)

Cédric
Cédric

Reputation: 2639

You can use element.style to change css properties.

Edit : It seems that you shouldn't use getElementById with React.

let element = document.getElementById('hi')
element.style.color = "white";
element.style.backgroundColor = "black";
<div id="hi">Hello</div>

Upvotes: 1

usama j
usama j

Reputation: 41

in the css file add #h1 { font-size: '12px'; } and in HTML file use this <div id="hi"></div>

Upvotes: 0

Alexander
Alexander

Reputation: 21

Its bad idea to use getElementById in React. You can use style like this

<div style={{ height: 10 }}>
  Hello World!
</div>

Or give attribute className to your element and make styles for that class in css.

<div className="button" />

Upvotes: 2

Related Questions