Fix show multiple faq's content on cms page

Author: mageprince

view/frontend/templates/faq_main.phtml

@@ -14,10 +14,10 @@
     <?php $faqGroupCollection = $block->getFaqGroupCollection(); ?>
     <?php if ($faqGroupCollection->getSize()): ?>
         <?php $pageType = $block->getPageTypeAction(); ?>
-        <div id="faq-loader">
+        <div class="mageprince-faq-loader">
             <img src="<?= $block->getViewFileUrl('images/loader-1.gif'); ?>"  alt="loader"/>
         </div>
-        <div class="faq-collection" id="faq-collection" style="display: none">
+        <div class="mageprince-faq-collection" style="display: none">
             <?php if ($block->getGroupId()): ?>
                 <div id="faq-content" class="faq-content">
                     <?php if ($block->isShowGroupTitle()): ?>

view/frontend/web/css/source/_module.less

@@ -1,4 +1,4 @@
-.faq-collection {
+.mageprince-faq-collection {
   margin-bottom: 20px;
   .ui-accordion .ui-accordion-header {
     display: block;

view/frontend/web/js/faq.js

@@ -8,8 +8,8 @@ define([
 
         setAccordian();
 
-        $('#faq-collection').show();
-        $('#faq-loader').hide();
+        $('.mageprince-faq-collection').show();
+        $('.mageprince-faq-loader').hide();
 
         function setAccordian() {
             $(".faq-accordion").accordion({