I need to display multipicklist using HTML tags in VF page(standard controller on Account)
Multipicklist should show some list of contacts belonging to that account.

I already have a big VF page where I want to replace apex:selectlist with html select tag because apex:selectList is not mobile compatible.

Below is my code, it is not returning Contacts on multipicklist (LHS):

<apex:page standardController="Account" extensions="MultiSelectPicklist_HTML" sidebar="false" lightningStylesheets="{!$User.UIThemeDisplayed == 'Theme4t'}">
    <apex:form id="frm">
        <apex:pagemessages id="pgmsg"/>
        <apex:pageBlock mode="edit" id="PB" >
 
           <apex:pageBlockSection columns="2" id="pbs1">
            Client Attendee<div style="color:red;font-size:20px;" > * </div>                    
            <apex:actionRegion id="ar">
                <apex:panelGrid columns="4" id="grid1" >
                    <select name="sel1" multiple="multiple" style="width:150px;height:100px;" size="5" value="{!leftselected}">    
                        <apex:repeat value="{!unselectedvalues}" var="con" id="theRepeat1">
                            <apex:selectOption itemValue="{!con.Id}" itemLabel="{!con.Name}" />
                        </apex:repeat>                           

                    </select>
                    <apex:panelGroup >
                        <br/>                                    
                        <apex:commandButton value=">>" action="{!selectclick}" reRender="grid1"/> <br/><br/>
                        <apex:commandButton value="<<" action="{!unselectclick}" reRender="grid1"/>
                    </apex:panelGroup>
                   <select name="sel2" multiple="multiple" style="width:150px;height:100px;" size="5" value="{!rightselected}">    
                        <apex:repeat value="{!selectedvalues}" var="con" id="theRepeat2">
                            <apex:selectOption itemValue="{!con.Id}" itemLabel="{!con.Name}" />
                        </apex:repeat>
                    </select>                               
                </apex:panelGrid>

            </apex:actionRegion> 
        </apex:pageBlockSection>
    </apex:pageBlock>
</apex:form> 
</apex:page>



..........


public class MultiSelectPicklist_HTML {
    
    Public List<string> leftselected{get;set;} 
    public SelectOption[] unselectedvalues {get;set;}
    Public List<string> rightselected{get;set;} 
    public SelectOption[] SelectedValues {get;set;}
    Private String currentAccountId;
    
  public MultiSelectPicklist_HTML(ApexPages.StandardController controller) {
        
Account Acc = new Account();
        string aid =  System.currentPageReference().getParameters().get('id');
        currentAccountId = String.valueOf(aid).substring(0, 15);
        System.debug(currentAccountId+' '+aid);
        List<Contact> conList_Acc = new List<Contact>();
        //custom custom multi picklist
        leftselected = new List<String>();       
        rightselected = new List<String>();
        selectedvalues=new List<SelectOption>(); 
        unselectedvalues=new List<SelectOption>();   
        
        conList_Acc =[Select id,name,Salutation,AccountId,Title from Contact where accountid =:currentAccountId order by Name];
            System.debug(conList_Acc); 
            if(conList_Acc.Size()>0){
                unselectedvalues.clear();
                for(Contact c : conList_Acc){
                    System.debug(String.valueOf(c.AccountId).substring(0, 15));
                    System.debug(currentAccountId);
                    if(String.valueOf(c.AccountId).substring(0, 15) == currentAccountId){                            
                        unselectedvalues.add(new SelectOption(c.Id,c.Name));
                    }
                }
            }       
            System.debug(unselectedvalues);
    }
    
    public PageReference selectclick(){
        List<SelectOption>  templeft = new List<SelectOption>();
        system.debug('selectedvalues--');
        for(Selectoption s : unselectedvalues)
        {            
            if(leftselected.contains(s.getvalue()))
            {
                SelectedValues.add (new SelectOption(s.getvalue(),s.getlabel()));                
            }
            else
            {
                templeft.add (new SelectOption(s.getvalue(),s.getlabel()));
            }            
        }
        unselectedvalues = templeft;        
        return null;        
    }
    
    public PageReference unselectclick(){        
        List<SelectOption>  tempRight = new List<SelectOption>();
        system.debug('selectedvalues--');
        for(Selectoption s : selectedvalues)
        {            
            if(rightselected.contains(s.getvalue()))
            {
                unSelectedValues.add (new SelectOption(s.getvalue(),s.getlabel()));                
            }
            else
            {
                tempRight.add (new SelectOption(s.getvalue(),s.getlabel()));
            }            
        }
        selectedvalues = tempRight;        
        return null;
    }
}


Please help me in figuring out the issue .Please advise.