Change CSS of Element A if Element B is displayed on the page

I'm new to jQuery so have come up with this code through reading other posts here but I am having trouble making it work on my site (FYI I am building on Webflow).

What I want to do is this: Example

I've designed a carousel where if you click the links on the left side then it will display different content on the right side container. The display of different information is based on CSS3 interactions that toggle the display attribute, not jQuery.

So if Element B is displayed on the webpage, then Element A will have a bold font weight, be a darker grey, and have a blue border on the side to indicate that is the active "link" (it's not actually a link).

Here is an example of my code (since I build on Webflow, I'm recreating the html and css here myself):

HTML

<div class="carousel">
  <div class="on-load" id="on-load">Show on Load</div>
  <div class="dynamic-content" id="dc-1">Dynamic Content 1</div>
  <div class="dynamic-content" id="dc-2">Dynamic Content 2</div>
  <div class="dynamic-content" id="element-b">Element B</div>
  <div class="dynamic-content" id="dc-3">Dynamic Content 3</div>
  <div class="dynamic-content" id="dc-4">Dynamic Content 4</div>
  <div class="carousel-left">
    <div class="carousel-link" id="link-1">Link 1</div>
    <div class="carousel-link" id="link-2">Link 2</div>
    <div class="carousel-link" id="element-a">Element A</div>
    <div class="carousel-link" id="link-4">Link 4</div>
    <div class="carousel-link" id="link-5">Link 5</div>
  </div>
</div>

CSS

.carousel {
  position: relative;
  width: 750px;
  height: 500px;
  display: inline-block;
}
.dynamic-content {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 65%;
  padding: 20px;
  display: none;
}
.on-load {
  position: absolute;
  top: 0px;
  right: 0px;
  padding: 20px;
  display: inline-block;
}
.carousel-left {
  position: relative;
  float: left;
  width: 35%;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-itens: flex-end;
}

jQuery

var elemB = document.getElementById("element-b");
var elemA = document.getElementById("element-a");
  if(elemB.style.display = "inline-block"){
    elemA.style.color = "#505050";
    elemA.style.font-weight = "extra-bold";
    elemA.style.border-right = "6px solid #01aae4";
    }
  else{
    elemA.style.color = "#878787";
    }

Thanks!