How to get bootstrap-select drop down value in jquery? - php

Question

I have a drop down with name="country1" where I am getting dynamic data through query inside it. Now, I want to get the value of in my alert box but it's not working right now. So, How can I do this? Please help me.
code:
<div class="btn-group bootstrap-select show-tick">
<div class="dropdown-menu open">
<div class="bs-actionsbox">
<div class="btn-group btn-group-sm btn-block">
<button type="button" class="actions-btn bs-select-all btn btn-default">Select All</button>
<button type="button" class="actions-btn bs-deselect-all btn btn-default">Deselect All</button>
</div>
</div>
<ul class="dropdown-menu inner state1" role="menu">
<?php
$this->db->select('*');
$this->db->from('states');
$this->db->where('country_id','101');
$sql = $this->db->get();
$result = $sql->result_array();
foreach($result as $row)
{
?>
<li data-original-index="0">
<a tabindex="0" data-tokens="null">
<span class="text"><?php echo $row['name']; ?></span><span class="glyphicon glyphicon-ok check-mark"></span>
</a>
</li>
<?php
}
?>
</ul>
</div>
<select name="country1" class="bootstrap-select" title="India:State" multiple="" data-actions-box="true" tabindex="-98">
<?php
$this->db->select('*');
$this->db->from('states');
$this->db->where('country_id','101');
$sql1 = $this->db->get();
$result1 = $sql1->result_array();
foreach($result1 as $row1)
{
echo "<option value='".$row1['id']."'>".$row1['name']."</option>";
}
?>
</select>
</div>
jquery code:
<script>
$(document).ready(function(){
$('.state1 li').click(function(){
state = $(this).text();
alert(state);
});
});
</script>