how to get the element selected

Question

The dropdowns on the top right, I need to get the first three characters of the string of the type selected for example if the user selects Pizza Delivery i need the string "piz"

here is the url

    <div class="select-big select-small right">
<div class="select-holder">
<div class="button">
<div class="icon left"></div>
<p class="text left">Fast Food Pos System</p>
<a href="#" class="trigger right"></a>
<div class="cl">&nbsp;</div>
</div>
<div class="dropdown">
<ul>
<li><a href="#" class="icon-s icon-s1">Grocery</a></li>
<li><a href="#" class="icon-s icon-s2">Pizza Delivery</a></li>
<li><a href="#" class="icon-s icon-s3">Quick Service</a></li>
<li><a href="#" class="icon-s icon-s4">Retail</a></li>
<li><a href="#" class="icon-s icon-s5">Salon</a></li>
<li><a href="#" class="icon-s icon-s6">Bar</a></li>
</ul>
<div class="cl">&nbsp;</div>
</div>
</div>

here is the Jquery that I am working with

    $('.select-big ul li a').click(function () {
$(this).parents('.select-holder').find('.text').text($(this).text());
     // I need the string here

Answer 1

You can just use .text() and .substring(), like this:

$('.select-big ul li a').click(function () {
  $(this).parents('.select-holder').find('.text').text($(this).text());
  var type = $(this).text().substring(0, 3).toLowerCase();
  alert(type);
});

You can give it a try here