Здравствуйте.
Помогите пожалуйста разобраться, что ни так.
Нужно блок с классом cro-checkout-trustsection, добавить после класса block, и нужно именно на js.
Добавляю такой код, выдает ошибку
document.getElementById('block').classList.add('cro-checkout-trustsection');
Если кому надо на jQuery, то это будет так
var newElems = $("<div class='cro-checkout-trustsection'></div>")
.append('<div class="cro-checkout-trustsection-title">Você pode pagar com:</div>')
newElems.css("border", "1px solid rgb(229, 229, 229)");
$('.block').append(newElems);
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title></title>
<link href="css/font-awesome.min.css" type="text/css" rel="stylesheet" />
<style>
}
.blocks, .block {width: 50%; float: left;}
}
</style>
<SCRIPT type="text/javascript" language="JavaScript"
src="forymjs.js"></SCRIPT>
</head>
<div class="blocks">
hisuhgiuo</div>
<div class="block">
fdgvisgdiu
</div>
</html>
var html = `<style>
img {
border: 0;
max-width: 100%;
}
.cro-checkout-trustsection {
background-color: white !important;
border-radius: 5px;
padding-top: 15px;
border: 1px solid rgb(229, 229, 229);
}
.cro-checkout-payment-methods {
width: 90%;
margin: 15px auto;
}
.cro-checkout-trustsection-title {
color: rgb(115, 115, 115);
font-size: 18px;
text-align: center;
padding-bottom: 15px;
}
.cro-guarantee-details-text {
color: rgb(83, 83, 83);
font-size: 18px !important;
line-height: 18px !important;
}
.cro-guarantee-details {
display: block;
background-color: rgb(250, 250, 250);
border-top-left-radius: 5px !important;
border-top-right-radius: 5px !important;
border-bottom-right-radius: 0px !important;
border-bottom-left-radius: 0px !important;
box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 8px 0px !important;
border: 1px solid rgb(204, 204, 204) !important;
margin-left: auto !important;
margin-right: auto !important;
width: 90% !important;
padding: 10px !important;
}
.cro-guarantee-details-text {
color: rgb(83, 83, 83);
font-size: 18px !important;
line-height: 18px !important;
}
.cro-boleto-details {
display: block;
background-color: rgb(250, 250, 250);
border-radius: 0 0 5px 5px;
box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 8px 0px !important;
border: 1px solid rgb(204, 204, 204) !important;
margin-left: auto !important;
margin-right: auto !important;
width: 90% !important;
padding: 10px !important;
}
.left {
float: left;
width: 20px !important;
margin-right: 10px !important;
}
.cro-guarantee-details-text {
color: rgb(83, 83, 83);
font-size: 18px !important;
line-height: 18px !important;
}
</style>
<div class="cro-checkout-trustsection">
<div class="cro-checkout-trustsection-title">Informações de pagamento e garantias:</div>
<div class="cro-guarantee-details">
<div class="left">
<img src="https://cdn.shopify.com/s/files/1/2459/3871/files/money-back.png?10304968336471885750" class="fireapps-shipping-icon-item">
</div>
<div class="cro-guarantee-details-text">Suas compras são seguras com devolução gratuita e garantia de reembolso</div>
</div>
<div class="cro-boleto-details">
<div class="left"><img src="https://cdn.shopify.com/s/files/1/2459/3871/files/boleto-bancario-logo_3x_cc7fde39-1430-45cb-9e51-991fc74b8bb5.png?890146874979855205" class="fireapps-shipping-icon-item"></div>
<div class="cro-guarantee-details-text">Você pode pagar com Boleto Bancario. Os pagamentos expiram em 24 horas</div>
</div>
<div class="cro-checkout-payment-methods"><img class="cro-checkout-payment-methods-img" src="https://cdn.shopify.com/s/files/1/2569/8774/files/brazil-payment-methods-optimized.jpg?17084784513000531164"></div>
</div>`;
document.body.insertAdjacentHTML('beforeEnd', html)
document.getElementById('block').classList.add('cro-checkout-trustsection');