为什么在jQuery函数中调用css时未应用css

Question

我实现了切换网格/列表视图。我使用以下HTML和jQuery代码调用这些视图：

当我从html代码中调用此函数并单击a链接时，它可以正常工作。

当我从另一个jquery函数调用函数ideaView时，发生了问题。在这种情况下，将不会应用CSS格式。

例如，当用户进行搜索时，我需要调用此函数以根据用户选择的视图显示结果，但该视图不起作用：

我不确定我是否清楚，我已经尽力了。提前谢谢。

$('a#list-view').click(function() {
  localStorage.setItem("ideaView", "1");
  ideaView(localStorage.getItem("ideaView"));
});

$('a#grid-view').click(function() {
  localStorage.setItem("ideaView", "0");
  ideaView(localStorage.getItem("ideaView"));
});

function ideaView(ideaView) {
  if (ideaView == 1) {
    $('#idea-list-group').removeClass('card-columns');
    $('.idea-cards').css('flex-direction', 'row');
    $('.idea-cards').addClass('mb-2');
  } else {
    $('#idea-list-group').addClass('card-columns');
    $('.idea-cards').css('flex-direction', 'column');
    $('.idea-cards').removeClass('mb-2');
  }
}

function searchIdea(event, form) {
  event.preventDefault();
  var $form = form;
  ....
  ideaView(localStorage.getItem("ideaView"));
}

<div class="row">
  <a id="list-view" href="#"><i class="fas fa-list-ul"></i> </a>
  <a id="grid-view" href="#"><i class="fas fa-th"></i> </a>
</div>