0

Preciso mudar a cor só do elemento que foi clicado, no caso mudar a cor de fundo da div - essa mesma e clonada varias vezes criando mais div no html dependendo do quanto é preciso - em todos os casos que fiz usando parent e siblings não obtevi sucesso , todas permanecem mudando de cor, preciso que so a div clicada mude de cor, e as demais permanei com a cor padrão.

     **Icon**
   <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">
    <i class="taskIcon glyphicon glyphicon-chevron-down">
    </i>
    </a>

    <div class="panel-group" id="accordion">
        <div class="panel panel-default task">
            <div class="panel-heading  taskToDo">
                <span class="col-sm-8 taskTitle">
                    <span class="checkTask"><i class="fa fa-check" aria-hidden="true"></i></span>
                    descricao
                </span>
    </div>
       </div>
          </div>
       JS
       $(".taskIcon").on("click", function () {
       $(this).toggleClass("glyphicon-chevron-down").toggleClass("glyphicon-chevron-up");
       $(".boxTipoDeAtividade").hide();
       $(".taskAtividades").addClass("glyphicon-chevron-down"); 
       **$(".taskToDo").addClass("taskToDoBackground");**
       });
       CSS 
       .taskToDoBackground{
       background-color: #efefef !important;
        }
8
  • Tentou passar por parâmetros? Tipo: function (numerar por exemplo os botões ) o onClick? Botão 1 onclick - muda cor do parâmetro específico.
    – Peaga SiCK
    Commented 6/11/2017 às 18:06
  • Marcelo, podes mostrar o elemento pai de <div class="taskToDo">?
    – Sergio
    Commented 6/11/2017 às 18:36
  • postei o restante Commented 6/11/2017 às 18:43
  • Agora ficou ainda mais confuso. Existe algum pai comum entre <a> e . taskToDo? esse HTML repete-se várias vezes na página certo?
    – Sergio
    Commented 6/11/2017 às 18:51
  • sim repete varias vezes Commented 6/11/2017 às 19:31

1 Resposta 1

1
$(this).closest(".taskToDo").addClass("taskToDoBackground");

Quando você faz o $(".taskToDo"), esse seletor retorna todos os elementos com essa classe. você tem que usar o .closest() pra retornar apenas o primeiro elemento mais proximo.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .