JSFiddle - React, Tailwind, and code Playground

HTML

<div id="footer" class="pagingCss">
    
    <a href="/CompanySearch/Home/Results?page=1">
        <span class="whiteBox">&lt;&lt;</span>
    </a>

    <a href="/CompanySearch/Home/Results?page=5">
        <span class="whiteBox">&lt;</span>
    </a>

    <a href="/CompanySearch/Home/Results?page=1">
        <span class="blackBox">1</span>
    </a>

    <a href="/CompanySearch/Home/Results?page=2">
        <span class="blackBox">2</span>
    </a>

    <a href="/CompanySearch/Home/Results?page=3">
        <span class="blackBox">3</span>
    </a>

    <a href="/CompanySearch/Home/Results?page=4">
        <span class="blackBox">4</span>
    </a> 
    
    <a href="/CompanySearch/Home/Results?page=5">
        <span class="blackBox">5</span>
    </a>

    <span class="selected">6</span>
    
    <a href="/CompanySearch/Home/Results?page=7">
    <span class="blackBox">7</span>
    </a>

    <a href="/CompanySearch/Home/Results?page=8">
        <span class="blackBox">8</span>
    </a>

    <a href="/CompanySearch/Home/Results?page=9">
        <span class="blackBox">9</span>
    </a> 
    
    <a href="/CompanySearch/Home/Results?page=10">
        <span class="blackBox">10</span>
    </a> 
    
    <a href="/CompanySearch/Home/Results?page=7">
        <span class="whiteBox">&gt;</span>
    </a> 
    
    <a href="/CompanySearch/Home/Results?page=10">
        <span class="whiteBox">&gt;&gt;</span>
    </a>
        </div>

CSS

body {
font-family: Calibri;
background-color: 
#D8D8D8;
margin-top: 0px;
text-decoration:none;
}

#footer:not([href]) {
letter-spacing: 0px;
}

#footer {
text-align: center;
margin-top: 10px;
}

.pagingCss {
font-size: 13px;
}

.whiteBox {
background-color: 
white;
color: 
black;
padding-right: 7px;
padding-left: 7px;
padding-top: 4px;
padding-bottom: 4px;
text-decoration: none;
margin-top: 10px;
letter-spacing: 0px;
}

.blackBox, 
.selected {
background-color: 
black;
color: 
white;
padding-right: 7px;
padding-left: 7px;
padding-top: 4px;
padding-bottom: 4px;
text-decoration: none;
margin-top: 10px;
letter-spacing: 0px;
}
.selected { 
    background: transparent; 
    color:#000;
}
.pagingCss a {
font-size: 13px;
color: white;
text-decoration:none;
}

JavaScript

$(function() {  
 $("#footer").contents().filter(function() {
    
     var $this = $(this);
     return $this.children().length == 0 && $.trim($this.text()).length > 0;

 }).wrap("<span class='whiteBox' />");
       
});