Toggle on a div beside (or below)

0

I'm having to manipulate a div from the click on another div .

Basically, one is on top of the other, I want to click on the top one and so the one on the bottom runs the .toggled() event. But one can not be within the other.

HTML

<div id="titulo" class=" toggled " align="left">Histórico</div>
<br>
<div id="divTabela">
    <table id="tabelainfo" name="tabelainfo" class=" bordasimples ">
    <thead>
    <tr id="titulotabela">
        <th>Data</th>
    </thead>
    <tbody>
    <tr id="corpotabela">
        <td align="center">15/5/2014 </td></tr>
    <tr id="corpotabelaalt" align="center">
        <td align="center">16/5/2014 10:56:10</td></tr>
    <tr id="corpotabela">
        <td align="center">16/5/2014 11:00:28</td></tr>
    </tbody>
    </table>
<br><br></div>

JavaScript

$("*").on("click", ".toggled", function(event){
    event.preventDefault();
    event.stopPropagation();

    console.log($(this));
    $(this).css({"color":"red","border":"2px solid red"});
    $(this).next("div").toggle();
});

JSFiddle

What do you suggest?

    
asked by anonymous 23.05.2014 / 16:33

2 answers

3
$('#elemento-de-clicar').click(function(){
    $('#elemento-alvo').slideToggle();
 });
    
23.05.2014 / 18:28
0
<!-- HTML -->    
<p class="linkToggle">
   <strong><span>[+] </span>Detalhamento dos Pacotes de Serviços</strong>
</p>
<div class="lista forToggle">
    olá mundo!
</div>
<!-- HTML -->


<script>
       $('.linkToggle').click(function () {
             $(this).next(".forToggle").toggle('slow', function () { });
             var val = $(this).html();
             if (val.indexOf("[+]") > -1)
                  $(this).html(val.replace("[+]", "[-]"));
             else
                  $(this).html(val.replace("[-]", "[+]"));
        });
</script>
    
23.05.2014 / 20:21