Как я помещаю пробел перед текстом параметра в элементе выбора HTML?

$(document).ready(function(){
     //var current_url = window.location.href;
     var current_url = "news";
     $(".sub-menu").find("a[href='" + current_url + "']").closest("ul").addClass("show");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="main-menu" class="main-menu collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li><a href="{% url 'home' %}"> <i class="menu-icon fa fa-home"></i>Home </a></li>
                <h3 class="menu-title">L&amp;D</h3><!-- /.menu-title -->
                <li class="menu-item-has-children dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="menu-icon fa fa-calendar"></i>MAIN</a>
                    <ul id="navigation" class="sub-menu children dropdown-menu">
                        <li><a href="news">News</a></li>
                        <li><a href="{% url 'sport' %}">Sport</a></li>
                        <li><a href="{% url 'lifestyle' %}">Lifestyle</a></li>
                        <li><a href="{% url 'economy' %}">Economy</a></li>
                        <li><a href="{% url 'politics' %}">Politics</a></li>
                    </ul>
                </li>
                <li class="menu-item-has-children dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="menu-icon fa fa-bolt"></i>ABOUT</a>
                    <ul class="sub-menu children dropdown-menu">
                        <li><a href="{% url 'authors' %}">Authors</a></li>
                        <li><a href="{% url 'history' %}">History</a></li>
                        <li><a href="{% url 'trivia' %}">Trivia</a></li>
                    </ul>
                </li>
            </ul>
        </div>