Javascript copiando conteúdo de outra DIV que não é para copiar

priscilacarvalho · Setembro 12, 2018

Alguém pode me ajudar por favor?

O script que fiz é para transformar a matriz curricular que está em um ul em colunas separadas, mas ele está pegando a matriz curricular de outros cursos. Lembro que a como separar isso por seletor, mas não consigo entender a lógica de como fazer dentro do loop.

https://codepen.io/priscilacarvalho/pen/bxoYaN

<!-- Button trigger modal -->
<a href="" class="circle-modal blue" data-toggle="modal" data-target="#administracao">
  <i>Administração</i>
</a>

<!-- Modal -->
<div class="modal fade" id="administracao" tabindex="-1" role="dialog" aria-labelledby="administracao">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
        <h3 class="modal-title text-center" id="myModalLabel">Administração</h3>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-sm-12">
            <h4>Perfil Profissional</h4>
            <p class="text-justify">Na UNIFAMMA o estudante de Administração aprenderá que o principal papel do administrador é conceber, planejar e executar estratégias que visam o melhor desempenho da organização em qualquer mercado de atuação. Todas as organizações, com ou sem fins lucrativos, privadas ou públicas, grandes ou pequenas e operando em qualquer setor da economia necessitam de administradores. O curso de Administração da UNIFAMMA busca desenvolver empreendedores e administradores capazes de promoverem o avanço da sociedade, por meio de uma formação voltada para identificação e resolução de problemas, do trabalho em equipe e da criatividade.</p>
          </div>
          <div class="clearfix"></div>
          <hr>
          <div class="col-sm-12">
            <h4>Matriz curricular</h4>            
          </div>
         <ul>
 	<li>Comunicação oral e escrita</li>
 	<li>Contabilidade Geral</li>
 	<li>Filosofia e Ética</li>
 	<li>Matemática Aplicada</li>
 	<li>Metodologia do trabalho Científico</li>
 	<li>Teoria Geral da Administração</li>
 	<li>Economia</li>
 	<li>Matemática Financeira</li>
 	<li>Sociologia</li>
 	<li>Direito Empresarial</li>
 	<li>Psicologia Organizacional</li>
 	<li>Gestão de Custos</li>
 	<li>Teoria das Organizações</li>
 	<li>Estatística</li>
 	<li>Macroeconomia</li>
 	<li>Gestão de Pessoas e Subsistemas de RH</li>
 	<li>Sistemas de Informação</li>
 	<li>Gestão da cadeia de suprimentos</li>
 	<li>Administração de Marketing</li>
 	<li>Antropologia</li>
 	<li>Prática de Gestão de Pessoas e Departamento Pessoal</li>
 	<li>Planejamento Financeiro</li>
 	<li>Pesquisa Operacional</li>
 	<li>Sistemas de produção de bens e serviços</li>
 	<li>Composto de Marketing</li>
 	<li>Administração Pública</li>
 	<li>Administração Financeira</li>
 	<li>Logística</li>
 	<li>Empreendedorismo</li>
 	<li>Administração de Projetos</li>
 	<li>Direito Trabalhista</li>
 	<li>Consultoria Organizacional</li>
 	<li>Estratégia Empresarial</li>
 	<li>Mercados Financeiros</li>
 	<li>Ciência Política</li>
 	<li>Gestão do Agronegócio</li>
 	<li>Gestão da Qualidade</li>
 	<li>Análise de Investimento</li>
 	<li>Varejo</li>
 	<li>Tópicos Especiais I: Produção científica</li>
 	<li>Gestão Ambiental</li>
 	<li>Componente Curricular Optativo</li>
 	<li>Jogos de Empresa</li>
</ul>
        </div>
      </div>
      <div class="modal-footer">

<button type="button" class="btn btn-info text-white" data-dismiss="modal">
<i class="fa fa-graduation-cap"></i>
<span>Inscreva-se</span> 

</button>
      </div>
    </div>
  </div>
</div>

<!-- Button trigger modal -->
<a href="" class="circle-modal blue" data-toggle="modal" data-target="#ArquiteturaeUrbanismo">
  <i>Arquitetura e Urbanismo</i>
</a>

<!-- Modal -->
<div class="modal fade" id="ArquiteturaeUrbanismo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" style="display: none;">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
        <h3 class="modal-title text-center" id="myModalLabel">Arquitetura e Urbanismo</h3>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-sm-12">
            <h4>Perfil Profissional</h4>
            <p class="text-justify">O curso de Arquitetura e Urbanismo é bastante dinâmico, e na UNIFAMMA o profissional aprenderá a ter senso crítico e estético apurado, sensibilidade criativa aguçada e habilidade técnica desenvolvida para abordar e tratar problemas sociais relacionados à produção do espaço. Na prática o Arquiteto é capaz de exercer uma gama de atividades relativas às áreas de Arquitetura e Urbanismo: desenvolver pesquisas; estabelecer diretrizes; planejar e elaborar projetos com viabilidade técnico-econômica, considerando fatores culturais, estéticos e sociais; absorver novas tecnologias, elaborar soluções alternativas e propor com criatividade novas aplicações considerando aspectos ambientais e humanos, de maneira ética e socialmente responsável.</p>
          </div>
          <div class="clearfix"></div>
          <hr>
          <div class="col-sm-12">
            <h4>Matriz curricular</h4>            
          </div>
          <div class="clearfix"></div><div class="clearfix"></div><div class="clearfix"></div><div class="clearfix"></div><div class="clearfix"></div><div class="clearfix"></div>
        </div>
      </div>
      <div class="modal-footer">

<button type="button" class="btn btn-info text-white" data-dismiss="modal">
<i class="fa fa-graduation-cap"></i>
<span>Inscreva-se</span> 

</button>
      </div>
    </div>
  </div>
</div>

<script>
var count = 0;
var perCol = 11;
var $ul = $('.modal-body ul');
var rows = Math.ceil($ul.find('li').length/perCol);
// var clearfix = "<div class='clearfix'></div>";
for(var i=0; i<=rows;i++){

  if(count % 4 == 0){    
    $ul.before("<div class='clearfix'></div>");   
  }
  

  $ul.before('<div class="col-sm-3" data-count='+count+'><ul class="list-unstyled"></ul></div>');   
  
  count +=1;
}

for(var i=0;i<=rows;i++){
  $ul.find('li:lt('+(perCol)+')').appendTo('ul.list-unstyled:eq('+(i)+')');
}

$("ul.list-unstyled:empty").parent().remove();

$ul.remove();
</scritp>

Maujor · Setembro 12, 2018

No Codepen há um código para o curso de Adminstração e funciona como esperado.
No post há mais código para o curso de Aquitetura e Urbanismo SEM A GRADE.
Está confuso. Não para saber o que você pretende, pois no Codepen funciona.
Acrescentei o curso de Arquitetura e Urbanismo no Codepen e ambos funcionaram como esperado.