chatWrapper.insertAdjacentHTML('beforeend', '<div class="chat-user chat-body"><div class="chat-user__image"><img src="img/person2.png" alt=""></div><div id="wrapperMessage" class="chat-user__message chat-message"><div class="chat-user__time chat-time" id="timeAgo">8 minutes ago</div></div></div>');
const chatWrapper = document.querySelector('.chat__wrapper');
let inputMessage = document.querySelector('.input-message');
const sendMessage = document.querySelector('.send-message');
sendMessage.addEventListener("click", function (e) {
chatWrapper.insertAdjacentHTML('beforeend', '<div class="chat-user chat-body"><div class="chat-user__image"><img src="img/person2.png" alt=""></div><div id="wrapperMessage" class="chat-user__message chat-message"><p class="chat-user__text">'+inputMessage.value+'</p><div class="chat-user__time chat-time" id="timeAgo">8 minutes ago</div></div></div>');
setTimeout(() => {
},0);
});
let btn = document.querySelector('.btn');
btn.addEventListener('click', function() {
let item,
item_active = document.querySelector('.item.active').nextElementSibling;
while (item_active) {
if (item_active.classList.contains('item')) {
item = item_active;
break;
}
}
document.querySelectorAll('.item').forEach(function(tab) {
tab.classList.remove('active');
});
if (item != undefined) {
item.classList.add('active');
} else {
document.querySelector('.item').classList.add('active');
}
});
let btn = document.querySelector('.btn');
let item = document.querySelectorAll('.item');
let el_active;
function nextPage() {
for (let i = 0, length = item.length; i < length; i++) {
if (item[i].classList.contains('active')) {
el_active = i;
break;
}
}
item.forEach(function(tab) {
tab.classList.remove('active');
});
if ( (el_active+1) === item.length) {
item[0].classList.add('active')
} else {
item[el_active + 1].classList.add('active')
}
}
btn.addEventListener('click', nextPage);
const url = 'https://jsonplaceholder.typicode.com/todos/2'
const result = await fetch(url).then(data => data.json())
$(document).ready(function () {
var ytFrame = '<iframe id="player" class="video" src="https://www.youtube.com/embed/B02INhxSnQY?autoplay=1" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen="allowfullscreen" width="560" height="315"></iframe>';
$('.ytLoader').html(ytFrame);
});
<div class="ytLoader">
</div>
$(document).ready(function() {
const priceKbm = 500;
const cenagibdd = 100;
if ($('#star').is(':checked')) {
let rezult = (Number(priceKbm) + Number(cenagibdd)).toString();
} else {
let rezult = (Number(priceKbm) + Number(0)).toString();
}
});
(let i = 0; i < slides.lenght; i++) {
<select class="selectpicker" data-width="fit">
<option value="English" data-content='<span class="flag-icon flag-icon-us"></span> English'>English</option>
<option value="Español" data-content='<span class="flag-icon flag-icon-mx"></span> Español'>Español</option>
</select>
$('.selectpicker').change(function(){
console.log($(this).val())
});
let cards = document.querySelectorAll('.card')
cards.forEach((card) => {
card.addEventListener('click', () => {
cards.forEach((item) => {
item.classList.remove('active')
})
card.classList.remove('active')
card.previousElementSibling.classList.add('active')
card.nextElementSibling.classList.add('active')
})
})