JSFiddle - React, Tailwind, and code Playground

HTML

<div id="siteMapContainer" >&nbsp;</div>
<br/>



<div id="siteMap" style="display:block">
    <ul>
        <li><a href="Dashboard.aspx">Dashboard</a></li>
        <li><a href="#">Market Trends</a></li>
        <li><a href="#">Master</a>
            <ul>
                <li><a href="ProductList.aspx"  id="prdLink">Products</a>
                    <ul>
                        <li><a href="#">Product List</a>
                            <ul>
                                <li><a href="ProductDetails.aspx">Product Details</a></li>
                            </ul>
                        </li>
                    </ul>
                </li>
                <li><a href="UsingModalPopup.aspx" id="segLink" >Segments</a></li>
                <li><a href="Framee1.aspx" >Companies</a></li>
            </ul>
        </li>
        <li><a href="#">Settings</a>
            <ul>
                <li><a href="DashboardSettings.aspx">Dashboard Settings</a></li>
            </ul>
        </li>
    </ul>        
</div>

<div id="divP" style="background-color:silver">&nbsp;</div>

JavaScript

$(document).ready(function() {
    
    
    
    
    
    $lnkStr1 = "ProductList.aspx";
    $li = jQuery('#siteMap [href=' + $lnkStr1 + ']').parents('li');
container = $('#divP');
    $li.each(function(i) {

        if (i > 0) {
            $('<span> &gt; </span>').prependTo(container);
        }

        if (($(this).children('a:first').attr('href') == '#') || $(this).children('a:first').attr('href') == $lnkStr1) {
            $textContent = $(this).children('a:first').text();
            $(container).prepend($textContent);
        }
        else {
            $(this).children('a:first').clone().prependTo(container);
        }
    });

});