css Question posted in
Some basic documentation can be found here.

Css – How to add style to html element using javascript

I want to add style="font-weight: bold;" to the label tag of the html below:
<label for="Results_CheckZ" style="font-weight: bold;">Sample content</label>

<div id="Results_CheckZField" class="field-normal both checkZ">
    <div class="field-control">
        <div class="container-normal">
            <label for="Results_CheckZ">Sample content</label>
        </div>
    </div>
</div>

I tried the following but it didn’t work.
I don’t know how to get the label tag when it doesn’t have an id or class.
If anyone has any advice I’d appreciate it. Thanks!

const targetLabel = document.querySelector('#Results_CheckZField .field-control .container-normal');
targetLabel.setAttribute("style", "font-weight: bold;");
Tags:

2

Answers


  1. 0

    Select the label tag directly within the container-normal class and then apply the style to it.

    const targetLabel = document.querySelector('#Results_CheckZField .field-control .container-normal label');
targetLabel.style.fontWeight = "bold";

    const targetLabel = document.querySelector('#Results_CheckZField .field-control .container-normal label');
targetLabel.style.fontWeight = "bold";
    <div id="Results_CheckZField" class="field-normal both checkZ">
    <div class="field-control">
        <div class="container-normal">
            <label for="Results_CheckZ">Sample content</label>
        </div>
    </div>
</div>
    Login or Signup to reply.
  2. 0

    Select the tag and then use style attribute to add what ever css you want to apply

    document.querySelector('label').style.fontWeight = '900'
    <div id="Results_CheckZField" class="field-normal both checkZ">
    <div class="field-control">
        <div class="container-normal">
            <label for="Results_CheckZ">Sample content</label>
        </div>
    </div>
</div>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search