Adicionar Classe

[GustavoDose 1]

Galera, estou com uma duvida, preciso que ao clicar sobre a li ele adicione uma classe

mas apenas na li clicada, meu problema tambem é a classe ver é um botão, gostaria de saber como fazer para quando clicar na li o conteudo abrir e não apenas no botão.

 

 

codigo javascript

<script>
jQuery(document).ready(function(){
    var $mostrar = jQuery(".ver"),
        $esconder = jQuery(".esconder"),
        $texto = jQuery(".conteudo");
        
            $texto.hide();
            $mostrar.on("click", function(){
                $(this).next().slideToggle('fast')
                    .siblings('.conteudo:visible').slideToggle('fast');
            });
            $esconder.on("click", function(){
                $texto.slideToggle('fast');
            });
            $mostrar.on("click", function(e){
                e.stopPropagation();
                });
            jQuery("body").on("click", function(){
                $texto.hide();
            });
});
</script>

[L. Henrique 179]

Creio que isso pode resolver seus problemas:
http://jsfiddle.net/wigster/MeTQQ/
http://koen.kivits.com/articles/pure-css-menu/

[GustavoDose 1]

Não resolve pelo fato que vou ter varias li e ao clicar sobre cada um delas ela abre o seu conteúdo, então dessa forma cada uma teria que ter uma id, preciso que ao clicar sobre a li abra seu conteúdo e aplique uma classe sobre essa li clicada

[Douglas Julião 34]

É isso que você precisa?

$('.elemento li').on('click',function(){
     $(this).addClass('suaclass');
     $(".ver").slideToggle('fast');
});

coloquei o código bem basicão.

[GustavoDose 1]

Douglas ja achei outra forma de fazer meu problema agora é remover a classe quando esconder denovo o conteudo, ou quando abrir outro conteudo ;/

Olha como eu fiz, vê se consegue ajudar, preciso que quando fechar o conteudo aberto saia a classe e que quando abrir outro adicione a classe nesse que via abrir e feche o conteudo aberto.

<script>
jQuery(document).ready(function(){
    
    var $mostrar = jQuery(".abrir"),
        $esconder = jQuery(".esconder"),
        $texto = jQuery(".conteudo");
        
            $texto.hide();
            $mostrar.on("click", function(){
                $(this).find('.conteudo').slideToggle('fast');
               $('.conteudo').addClass('sele');
            });
   
            
            $mostrar.on("click", function(e){
                e.stopPropagation();
            });
            
            jQuery("body").on("click", function(){
                $('.conteudo').removeClass('sele');
                $texto.hide();
            });
});
</script>

Ja tentei colocar um evento quando clicar no esconder tirar a classe mas nao deu certo, meu maior problema é quando clicar para abrir outro conteudo o que esta aberto feche

[Douglas Julião 34]

Se não me engano você vai precisar usar o each() do jQuery, http://api.jquery.com/each/

para fazer algo mais ou menos assim:

mas com o each você precisar criar um array com os lis.

        $.each(Array,function(i,valor){
            if(i == 'valor do elemento clicado'){
               $('li').addClass('classe');
            }else{
               $('li').removeClass('classe');
            }
        });

Também ja usei assim:

$('li').addClass('classe').siblings().removeClass('classe');

Espero ter ajudado O_O, boa sorte!

[GustavoDose 1]

Cara não consegui fazer desta forma, mas acredito que estou fazendo alguma coisa errado. sei la ;/

[Douglas Julião 34]

Coloca o trecho do seu html aqui, ai eu tento te ajudar montando o script

[GustavoDose 1]

<ul>

<li class="abrir">

<div class="conteudo">

<ul>

<li>dadsadas</li>

<li>dadsadas</li>

<li>dadsadas</li>

<li>dadsadas</li>

<li>dadsadas</li>

<a class="esconder"></a>

</ul>

</div>

</li>

</ul>

[Douglas Julião 34]

ve se isso ja te ajuda:

 $mostrar.on("click", function(){
      var index = jQuery(this);
      
      $mostrar.removeClass('sele');

      index.find('.conteudo').slideToggle('fast');
      index.addClass('sele');
 });

[GustavoDose 1]

Ajudou sim, mas ainda não consigo fazer fechar o que esta aberto, acredito que vou ter que fazer a função fechar todos e dai abrir o determinado conteudo ;/

[Douglas Julião 34]

Acho que da pra fazer mais ou menos assim:

jQuery(document).ready(function($){
    
    var $mostrar = $(".abrir"),
        $esconder = $(".esconder"),
        $texto = $(".conteudo");
        
            	$texto.hide();
			$mostrar.on("click", function(){
			      var index = $(this);
			      
			      $mostrar.removeClass('sele');
			      $texto.hide();

			      index.find('.conteudo').slideToggle('fast').siblings().slideToggle('fast');
			      console.log(index);
			      index.addClass('sele');
			      

			});
   
            
});

é isso??

[GustavoDose 1]

É isso ai cara, problema agora é que ao fechar ele fecha junto a li que tem o clique para abrir ;/ mas o funcionamento é esse mesmo

[Douglas Julião 34]

Mas sua estrutura não é essa?

<ul>
    <li class="abrir">item1
        <div class="conteudo">
            <ul>
                <li>dadsadas</li>
                <li>dadsadas</li>
                <li>dadsadas</li>
                <li>dadsadas</li>
                <li>dadsadas</li>
                <a class="esconder"></a>
            </ul>
        </div>
    </li>
    <li class="abrir">item2
        <div class="conteudo">
            <ul>
                <li>dadsadas</li>
                <li>dadsadas</li>
                <li>dadsadas</li>
                <li>dadsadas</li>
                <li>dadsadas</li>
                <a class="esconder"></a>
            </ul>
        </div>
    </li>
</ul>

Era pra funcionar :/

[GustavoDose 1]

Nossa coloquei a errada ;/ putz

 

Desculpa cara ;/

<li class="abrir">item2
   <ul> 
      <div class="conteudo">
         dhaudhasudhsaud
       </div>
    </ul>
</li>