How to select a class inside a class CSS – WordPress

I am facing a problem. I am new at CSS. I pasted the code below.

There are 2 options:

I want to select the Join Class.
this is a WordPress website. I want to style the join Course text. but if I select .jclass, it’s not for text. It’s a div. on the other hand, if I select menu-item-wrap then both are selected. So how can I select the menu-item-wrap under the jclass?

<div id="page-navigation" class="navigation page-navigation">
  <nav id="menu" class="menu menu--primary">
    <ul id="menu-primary" class="menu__container sm sm-simple" 
        data-smartmenus-id="16650233980002595">
      <li class="jclass menu-item menu-item-type-custom menu-item-object-custom menu-item-4833 level-1">
         <a href="#" onclick="return true">
           <div class="menu-item-wrap">
             <span class="menu-item-title">
               Join Class
             </span>
           </div>
         </a>
       </li>
       <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4847 level-1">
         <a href="http://techgeneration.org/courses/"
            onclick="return true">
           <div class="menu-item-wrap">
             <span class="menu-item-title">
               Courses
             </span>
           </div>
         </a>
       </li>
     </ul>
   </nav>
</div>