border-image: linear-gradient(150deg,#adf2f7 10%, transparent 30%, transparent 70%, #adf2f7 90%);
$('li:nth-child(n5)').hide();
$(el).on('click', function() {
$(this).toggleClass(className);
});
// Первый вариант с jQ. Где e - это нужный селектор,
// на который нужно повесить событие "клик"
// this - тот же селектор, его можно заменить на другой, нужный
// className - это имя класса, который нужно добавлять
// и удалять по событию "клик"
// Так как подозреваю, что Вы недавно в JS, объясню подробней:
// Большинство листенеров (слушателей, событий) можно повесить
// Именно описанным сверху способом, где мы меняем
// 'click' на 'mousemove', 'resize' и так далее по необходимости
// Первый параметр здесь - название события
// Второй - функция-коллбэк, функция обратного вызова,
// Которая срабатывает при наступлении этого события
// И никогда иначе.
// Внутри тела функции-коллбэка (то есть внутри фигурных скобок)
// Проводим все необходимые Вам действия.
document.querySelector(el).addEventListener('click', function() {
el.classList.toggle(className);
});
// Второй вариант на plain JS, делает то же самое
// Для простоты, красоты и читабельности кода можно
// заранее объявить переменную
// и записать в неё ДОМ-элемент:
var el = document.querySelector(el).
el.addEventListener(....)
const cardSelector = '.post';
const buttonSelector = '.post > img';
const menuSelector = '.post-info';
const activeClass = 'active';
document.addEventListener('click', function(e) {
if (!e.target.closest(menuSelector)) {
document.querySelectorAll(menuSelector).forEach(n => n.classList.remove(activeClass));
}
if (e.target.matches(buttonSelector)) {
e.target.closest(cardSelector).querySelector(menuSelector).classList.add(activeClass);
}
});
class="li" присвоить атрибут num_id="x", class="li-dropdown li-hidden"class="li-dropdown", которая бы убирала или добавляла всем class="li-dropdown" класс li-hidden
<button id="ulButton" onclick="ulToggle();">Кнопка</button>
<ul id="ul1">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
</ul>
<script>
var ul= document.querySelectorAll('#ul1>li'), N=3;
[].forEach.call(ul, function(i,ind) {
if(ind>=N) {
i.hidden=1;
}
});
function ulToggle () {
[].forEach.call(ul, function(i,ind) {
if(ind>=N) i.hidden=!i.hidden;
});
}
</script>