Search suggestion places search word infront of suggestions - ajax

Question

Currently, I am working on a project I've "inherited" from someone else and have trouble fixing some stuff.
Just when I thought I am done with this project, I found, that if I search for example "apple" and the suggestions of the search are "foo apple bar", it will throw out "apple foo bar"
Here is the code:
function select_data()
{
global $wpdb;
$product_name=$_POST['product_name'];
if(!empty($product_name))
{
$unique_id = 'prodct_search';
$query ="SELECT * FROM `wp_posts` WHERE `post_title` LIKE '%".$product_name."%' AND `post_type` = 'product'";
$locar = $wpdb->get_results($query);
if($locar)
{
echo '<ul>';
foreach($locar as $loca)
{
echo '<li id="'.$loca->ID.'" onClick="filladsearch_loc('.this.',\''.addslashes($loca->post_title).'\',\''.$unique_id.'\')">'.$loca->post_title.'</li>';
}
echo '</ul>';
}
else
{
echo '<ul><li>No products were found matching your search.</li></ul>';
}
}
die();
}
And
function select_data1()
{
global $wpdb;
$product_name=$_POST['product_name'];
if(!empty($product_name))
{
$unique_id = 'prodct_search';
$query ="SELECT * FROM `wp_posts` WHERE `post_title` LIKE '%".$product_name."%' AND `post_type` = 'product'";
$locar = $wpdb->get_results($query);
if($locar)
{
echo '<ul>';
foreach($locar as $loca)
{
$titcapital=strtoupper($loca->post_title);
$proupper=strtoupper($product_name);
$stringsearched=str_replace($proupper,"",$titcapital);
//$createdarr=explode($product_name,$loca->post_title);
$finalstring='<span class="pro_top">'.strtoupper($product_name).'</span>'.strtoupper($stringsearched);
//print_r($createdarr);
echo '<li id="'.$loca->ID.'" onClick="filladsearch_loc('.this.',\''.addslashes($titcapital).'\',\''.$unique_id.'\')">'.$finalstring.'</li>';
}
echo '</ul>';
}
else
{
echo '<ul><li>No products were found matching your search.</li></ul>';
}
}
die();
}
And here is what it looks like: