I have a problem with div not geting bootstrap styles

[bandiko]

i want it so when i click it get like the other classes im creating a new div but its not geting bootstrap styles

if	(document.readyState == `loading`)
	{document.addEventListener(`DOMContentLoaded`,ready);}
else{ready}
function ready(){const removebutton = document.querySelectorAll(`.remove-pr`);
 console.log(removebutton);
for( let i=0 ; i < removebutton.length; i++){	
	const button = removebutton[i]
	button.addEventListener(`click`,function(event){
		var buttonclicked= event.target
		buttonclicked.parentElement.parentElement.parentElement.remove()
	updatecarttotal()})}	
var addtocartbuttons=document.getElementsByClassName(`cart`)
for( let i=0 ; i < addtocartbuttons.length; i++){
var button = addtocartbuttons[i]
button.addEventListener(`click`,addtocartclicked)
}
				 
var value = document.getElementsByClassName(`c-input-text qty text`)
  for( let i=0 ; i < value.length; i++){
	  var input = value[i]
	  input.addEventListener(`change`, quantityChanged)
	  console.log(value);
  }
	function quantityChanged(event){
		var input = event.target
		if(isNaN(input.value) || input.value <=0 ){
			input.value = 1
		}
		
			
		updatecarttotal()

		}
				 
function addtocartclicked(event){
	var button =event.target
	var shopitem = button.parentElement.parentElement.parentElement
	var title = shopitem.getElementsByClassName(`why-text`)[0].innerText
	var imgsrc= shopitem.getElementsByClassName(`img-fluid`)[0].src
	console.log(title,imgsrc)
	additemtocart(title,imgsrc)
	
}		
	function additemtocart(title,imgsrc){
				 var cartrow = document.createElement(`div`)
				 cartrow.classList.add(`cart-list`)
				 var cartitems = document.getElementsByClassName(`side`)[0]
				 var cartrowcontents =` <a href="#" class="photo"><img src="images/img-pro-01.jpg" class="cart-thumb" alt="" /></a>
                            <h6><a href="#">Delica omtantur </a></h6>
                            <p>1x - <span class="price">$80.00</span></p>`
				 cartrow.innerHTML = cartrowcontents
				 cartitems.append(cartrow)
		
	}
 
function updatecarttotal() {
	var cartitemcontainer = document.getElementsByClassName(`table`)[0]
	 var removebutton = document.querySelectorAll(`.cart-items`)
	 var total =0
	 for( let i= 0 ; i < removebutton.length; i++){
		 var removebutton = removebutton[i]
		 var priceelement = removebutton.getElementsByClassName(`price-pr`)[i]
		 var quantitylement = removebutton.getElementsByClassName(`c-input-text qty text`)[i]
		 
		 
		 
		 var price =parseFloat(priceelement.innerText.replace(`$`,``))
		 var quantity = quantitylement.value
		 total = total + (price*quantity)
		 
		 document.getElementsByClassName("d-flex-gr-total")[i].innerText=`$`+total;
		 document.getElementsByClassName("total-pr")[i].innerText=`$`+total;
		
		 console.log(quantitylement)		 }
  
	}
				}

html

<div class="side">
                <a href="#" class="close-side"><i class="fa fa-times"></i></a>
                <li class="cart-box">
                    <ul class="cart-list">
                        <li class = "cart1">
                            <a href="#" class="photo"><img src="images/img-pro-01.jpg" class="cart-thumb" alt="" /></a>
                            <h6><a href="#">Delica omtantur </a></h6>
                            <p>1x - <span class="price">$80.00</span></p>
                        </li>
                        <li>
                            <a href="#" class="photo"><img src="images/img-pro-02.jpg" class="cart-thumb" alt="" /></a>
                            <h6><a href="#">Omnes ocurreret</a></h6>
                            <p>1x - <span class="price">$60.00</span></p>
                        </li>
                        <li>
                            <a href="#" class="photo"><img src="images/img-pro-03.jpg" class="cart-thumb" alt="" /></a>
                            <h6><a href="#">Agam facilisis</a></h6>
                            <p>1x - <span class="price">$40.00</span></p>
                        </li>
                        <li class="total">
                            <a href="#" class="btn btn-default hvr-hover btn-cart">VIEW CART</a>
                            <span class="float-right"><strong>Total</strong>: $180.00</span>
                        </li>
                    </ul>
                </li>
            </div>