I'm struggling to apply styles to a deeply nested element using jQuery and JavaScript. I understand how to style nested elements, but I'm having trouble targeting a specific deeply nested element.
My website is built on WordPress, and it has inserted multiple divs around the element I want to style.
The element I'm trying to style has the class name .bx-wrapper. However, I only want to target the .bx-wrapper that is nested inside the class .associate-wrapper.
Below is the current HTML structure:
<div class="row associate-wrapper">
<li id="black-studio-tinymce-16" class="widget">
<div class="textwidget">
<div class="row"></div>
<div class="col-md-12 text-center"></div>
<div class="col-md-12 text-center">
<div class="bx-wrapper">
<p>content....</p>
</div>
</div>
</div>
</li>
</div>
And here is my current jQuery code that is not working:
$('.associate-wrapper').find('.bx-wrapper').css('position', 'absolute', 'margin-top', '30px');