JSFiddle - React, Tailwind, and code Playground

by marcgrabow

HTML

<div class="api-block">
    
    <div class="api-structure">
    
        <div class="api-block" >
    
                    <span unselectable="on">
                        <a unselectable="on" href="javascript:;" class="ms-cui-ctl-medium api-block-control" data-method="Edit" data-value="" mscui:controltype="Button" role="button">
                            <span unselectable="on" class="ms-cui-ctl-iconContainer">
                                <span unselectable="on" class=" ms-cui-img-16by16 ms-cui-img-cont-float"><img border="0" unselectable="on" alt="" src="/_layouts/images/EDIT.GIF"></span>
                            </span><span unselectable="on" class="ms-cui-ctl-mediumlabel">Edit 3</span>
                        </a>
                    </span> 

        </div>
                
    </div>

</div>

JavaScript

var length = $('.api-block:first').find('.api-block-control:not(".api-block > .api-block-control ")').length;

document.write("should be 0: " + length);