Xpages Partial refresh with HTML ID - xpages

Question

I have an InputText which has a function onChange. This function triggers an HTML component with partial refresh. EveryClass in this DIV works great.
but If refreshID is a XPages Design Element Partial Refresh works fine but CSS class does not. For example. In this examle the div which has class named "card", when i click on it It collapse and expand. When The page loaded first It works great but after partial refresh Collapsing and expanding does not work. I do not want to use full refresh because I have added Loading indicator which works with partial refresh and does not work with full refresh. Is there any way to solve this problem. If anyone has a clue I can share full codes..
Thank You
<xp:div id="Results" styleClass="card">
<div class="card-header bg-transparent header-elements-inline">
<span class="card-title font-weight-semibold">
Find What you are looking for...
</span>
<div class="header-elements">
<div class="list-icons">
<i class="icon-help"></i>
<a class="list-icons-item" data-action="collapse"> </a>
<a class="list-icons-item" data-action="remove"> </a>
</div>
</div>
</div>
<div class="card-body">
<div class="form-group form-group-feedback form-group-feedback-left">
<xp:inputText style="width:100%;" id="CompanyName" value="#{viewScope.CompanyName}" styleClass="form-control border-success-300 border-1"> <xp:this.attrs>
<xp:attr name="placeholder" value="What is it You looking for?">
</xp:attr>
</xp:this.attrs>
<xp:typeAhead mode="full" minChars="2" ignoreCase="true" valueList="#{javascript:getCustomersList();}"> </xp:typeAhead>
<xp:eventHandler event="onchange" submit="true" refreshMode="partial"
refreshId="Results"> <xp:this.action><![CDATA[#{javascript:getSearchResults(viewScope.CompanyName)}]]></xp:this.action>
</xp:eventHandler></xp:inputText>
<div class="form-control-feedback"> <i class="mt-2 icon-reading text-muted"> </i> </div> </div>
<div class="">
<xp:comboBox id="Staff" value="#{viewScope.Staff}" styleClass="form-control"> <xp:this.disabled><![CDATA[#{javascript:viewScope.CompanyName=="" || viewScope.CompanyName==null; }]]></xp:this.disabled>
<xp:selectItems> <xp:this.value><![CDATA[#{javascript:viewScope.Staff}]]></xp:this.value> </xp:selectItems>
<xp:eventHandler event="onchange" submit="true" refreshMode="partial" refreshId="Results"> <xp:this.action><![CDATA[#{javascript:var fName = viewScope.CompanyName;var uName = viewScope.Staff;
getUrunDetails(fName, uName)}]]></xp:this.action> </xp:eventHandler></xp:comboBox></div><div class="">
<xp:label value="Lastest Order Date:" id="label3" styleClass="col-form-label"></xp:label></div> <div class=""><xp:inputText id="LatestOrderDate" value="#{viewScope.LatestOrderDate}" styleClass="text-right form-control border-success-300 border-1" disabled="true">
</xp:inputText> </div> </div>
</xp:div>
UPDATE-2
<div id="view:_id1:_id1766:Results" class="card">
<div class="card-header bg-transparent header-elements-inline"><span class="card-title font-weight-semibold">Ara...</span>
<div class="header-elements"><div class="list-icons"><a class="list-icons-item" href="#"><i class="icon-help"></i></a>
<a class="list-icons-item" data-action="collapse"></a><a class="list-icons-item" data-action="remove"></a></div></div></div>
<div class="card-body"><div class="form-group form-group-feedback form-group-feedback-left">
<span id="view:_id1:_id1766:_id2717" dojotype="ibm.xsp.widget.layout.data.TypeAheadReadStore" jsid="view__id1__id1766__id2717" minchars="2" mode="full"></span>
<div class="dijit dijitReset dijitInline dijitLeft dijitTextBox dijitComboBox dijitValidationTextBox form-control border-success-300 border-1" id="widget_view:_id1:_id1766:FirmaAdi" role="combobox" aria-haspopup="true" data-dojo-attach-point="_popupStateNode" lang="en" widgetid="view:_id1:_id1766:FirmaAdi" style="width: 100%;"><div class="dijitReset dijitRight dijitButtonNode dijitArrowButton dijitDownArrowButton dijitArrowButtonContainer" data-dojo-attach-point="_buttonNode" role="presentation" style="display: none;"><input class="dijitReset dijitInputField dijitArrowButtonInner" value="▼ " type="text" tabindex="-1" readonly="readonly" role="button presentation" aria-hidden="true"></div><div class="dijitReset dijitValidationContainer"><input class="dijitReset dijitInputField dijitValidationIcon dijitValidationInner" value="Χ " type="text" tabindex="-1" readonly="readonly" role="presentation"></div><div class="dijitReset dijitInputField dijitInputContainer"><input class="dijitReset dijitInputInner" name="view:_id1:_id1766:FirmaAdi" type="text" autocomplete="off" data-dojo-attach-point="textbox,focusNode" role="textbox" tabindex="0" id="view:_id1:_id1766:FirmaAdi" value="DÖKTAŞ DÖKÜMCÜLÜK TİC VE SAN. A.Ş." aria-invalid="false"><span class="dijitPlaceHolder dijitInputField" style="display: none;">Ne Aramıştınız?</span></div></div><div class="form-control-feedback"><i class="mt-2 icon-reading text-muted"></i></div></div><div><select id="view:_id1:_id1766:Urun" name="view:_id1:_id1766:Urun" class="form-control" size="1"> <option value="Staff 0</option>
<option value="Staff 1</option>
<option value="Staff 2</option>
<option value="Staff 3</option>
</select></div><div>
<label id="view:_id1:_id1766:label3" class="col-form-label">Son Sipariş:<a id="view:_id1:_id1766:link14" href="http://portal/xspFrmProposal.xsp?action=editDocument&documentId=FD0F115C68C2BD52432586950040A419" class="text-right mr-2 ml-2 r text-primary list-icons-item" target="_blank" data-popup="popover" data-trigger="hover" data-content="DÖKTAŞ DÖKÜMCÜLÜK TİC VE SAN. A.Ş. ye ait Sözleşme Formuna git..." data-original-title="Müşteri Bilgilerine Git" data-placement="bottom"><i class="icon-link2"></i></a></label></div><div><input type="text" value="11.03.2021 15:26:49" id="view:_id1:_id1766:SiparisTarihi" name="view:_id1:_id1766:SiparisTarihi" disabled="disabled" class="text-right form-control border-success-300 border-1"></div><div><label class="col-form-label">Son Teklif:<a id="view:_id1:_id1766:link12" href="http://portal.acarermetal.com.tr/ays/crm.nsf/xspFrmTeklif.xsp?action=editDocument&documentId=38ED7907DE9CFAD943258693003E7D3F" class="text-right mr-2 ml-2 r text-primary list-icons-item" target="_blank" data-popup="popover" data-trigger="hover" data-content="DÖKTAŞ DÖKÜMCÜLÜK TİC VE SAN. A.Ş. ye ait son teklif formuna git..." data-original-title="Müşteri Bilgilerine Git" data-placement="bottom"><i class="icon-link2"></i></a></label></div><div><input type="text" value="09.03.2021" id="view:_id1:_id1766:TeklifTarihi" name="view:_id1:_id1766:TeklifTarihi" disabled="disabled" class="text-right form-control border-success-300 border-1"></div><div><label class="col-form-label">Son Teklif Verilen Malzemeler:</label><textarea name="view:_id1:_id1766:Urunt" data-dojo-attach-point="focusNode,containerNode,textbox" autocomplete="off" class="dijitTextBox dijitTextArea dijitExpandingTextArea form-control elastic elastic-destroy dijitTextBoxDisabled dijitTextAreaDisabled dijitExpandingTextAreaDisabled dijitDisabled" tabindex="-1" lang="en" disabled="" aria-disabled="true" id="view:_id1:_id1766:Urunt" rows="1" widgetid="view:_id1:_id1766:Urunt" value="2 Ton FEMO 16995usd
" style="overflow: auto hidden; box-sizing: border-box; min-height: 72px; height: 68px;"></textarea></div></div></div>