Как реализовать подмену картинки и обратно на jQuery?

Question

[L_B_A]

Вот пример кода CodePen
Как сделать так, чтобы при клике на кнопку раскрытия таблиц менялась иконка:

нашел пример, но в этом случае он не работает:


Вот ссылки иноконок на которые нужно заменить:
https://habrastorage.org/webt/5e/7a/18/5e7a18b3252... - collapse all
https://habrastorage.org/webt/5e/7a/1a/5e7a1a0febe... - collapse one

И когда открываем одну табличку:

а потом открываем все, то эта открытая табличка сворачивается:


Подскажите, пожалуйста, решения

Answer 1

[0xD34F]

const icons = {
  one: [ 'url иконки раскрытия одного элемента', 'и закрытия' ],
  all: [ 'url иконки раскрытия всех', 'что здесь должно быть, думаю догадаетесь' ],
};

const getState = el => $(el)
  .closest('.team__info-worklog')
  .find('.worklog-table')
  .get()
  .map(n => $(n).is(':visible'));

const setState = (el, state) => $(el)
  .closest('.team__info-worklog')
  .find('.worklog-table').each((i, n) => $(n)[state[i] ? 'slideDown' : 'slideUp']()).end()
  .find('.worklog-expend-all img').attr('src', icons.all[+state.some(Boolean)]).end()
  .find('.worklog-list__expend img').attr('src', i => icons.one[+state[i]]);

const createUpdater = f => e => setState(e.target, f(getState(e.target), e));


$('.worklog-expend-all').on('click', createUpdater(state => {
  return Array(state.length).fill(!state.some(Boolean));
}));

$('.team__info-worklog').on('click', '.worklog-list__expend', createUpdater((state, e) => {
  const index = $(e.target).closest('.worklog-list__row').index();
  return state.map((n, i) => i === index ? !n : n);
}));