JSFiddle - React, Tailwind, and code Playground

HTML

<!--кнопки для включения категорий фильтра-->
<nav id="filter-portfolio">
  <a href="#" data-id="all">All</a>
  <a href="#" data-id="firstCategory">Planning</a>
  <a href="#" data-id="secondCategory">Branding</a>
  <a href="#" data-id="thirdCategory">Design</a>
  <a href="#" data-id="fourthCategory">Production</a>
  <a href="#" data-id="fifthCategory">Marketing</a>
</nav>

<!--картинки в карусели-->
<div class="table-row">
	<div class="container">
		<div class="fred-car-container works">
			<div class="fred-car enable-pagination image-pagination objImg">
				<!--first category-->
				<img id="portfolioImg1" class="firstCategory" src="img/team-1.png" width="600" height="370" alt="photo">
				<img id="portfolioImg2" class="firstCategory" src="img/team-1.png" width="600" height="370" alt="photo">
				<img id="portfolioImg3" class="firstCategory" src="img/team-1.png" width="600" height="370" alt="photo">
				<img id="portfolioImg4" class="firstCategory" src="img/team-1.png" width="600" height="370" alt="photo">
				<img id="portfolioImg5" class="firstCategory" src="img/team-1.png" width="600" height="370" alt="photo">
				<img id="portfolioImg6" class="firstCategory" src="img/team-1.png" width="600" height="370" alt="photo">
				<img id="portfolioImg7" class="firstCategory" src="img/team-1.png" width="600" height="370" alt="photo">

				<!--second category-->
				<img id="portfolioImg8" class="secondCategory" src="img/team-2.png" width="600" height="370" alt="photo">
				<img id="portfolioImg9" class="secondCategory" src="img/team-2.png" width="600" height="370" alt="photo">
				<img id="portfolioImg10" class="secondCategory" src="img/team-2.png" width="600" height="370" alt="photo">
				<img id="portfolioImg11" class="secondCategory" src="img/team-2.png" width="600" height="370" alt="photo">
				<img id="portfolioImg12" class="secondCategory" src="img/team-2.png" width="600" height="370" alt="photo">
				<img id="portfolioImg13" class="secondCategory"...

JavaScript

// создание обьекта для хранения картинок
  var filterImages = {
    
  }
  
  //добавление всех картинок в обьект
  $('.objImg').find('img').each(function(index, value){
    filterImages[index] = $(this);
  });

    //при клике должны удаляться те фото, у которых нет определенного класса и добавляться те, что имеют класс
  $('#filter-portfolio a').click(function(){
    
    //в переменную попадает атрибут фильтра, название которого совпадает с названием класса картинок из категории
    var dataAttr = $(this).data('id');
     
    if (dataAttr == 'all') {
      //как добавить все елементы в ДОМ из обьекта?
    }
      else {
          //удаляем все картинки
      $('.objImg img').remove();
      //Как найти в обьекте все картинки с соответствующим классом и добавить их обратно?
      $.each(filterImages, function(index, item){
          
      });
    }
  });