Selecting specific children on jQuery

Question

I'm trying to hide the divs on click using .click() event and .hide() method.

The thing is each one has a different ID that was 'chosen' by the user, so i can't just write the code for each case.

Example:

HTML

<body>
      <div id="box">
           <div id="div1"></div>
           <div id="div2"></div>
           <div id="div3"></div>
      </div>
</body>

jQuery

$(document).ready(function() {
     $(---selector for all divs 1,2,3----).click(function) {
          $(----specificDivIClicked----).hide();
     });
});

Basicaly, i'm trying to find a way to delete only the div i click on.

Answer 1

Try to select all divs inside box div :

$(document).ready(function()
{
    $('#box div').click(function(){
        $(this).hide();
    });
});

 $(document).ready(function() { $('#box div').click(function(){ $(this).hide(); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="box"> <div id="div1">div1</div> <div id="div2">div2</div> <div id="div3">div3</div> </div>

Answer 2

Thy blanks have been filled:

$(document).ready(function() {
     $('[id^="div"]').click(function() {
          //------------------------^---- You are missing (
          $(this).hide();
     });
});

Snippet

 $(document).ready(function() { $('[id^="div"]').click(function() { $(this).hide(); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="box"> <div id="div1">div1</div> <div id="div2">div2</div> <div id="div3">div3</div> </div>

Selecting specific children on jQuery

Question

2 answers

solution1
2 ACCPTED 2016-01-24 19:18:01

solution2
0 2016-01-24 19:17:25

Selecting specific children on jQuery

Question

2 answers

solution1 2 ACCPTED 2016-01-24 19:18:01

solution2 0 2016-01-24 19:17:25

solution1
2 ACCPTED 2016-01-24 19:18:01

solution2
0 2016-01-24 19:17:25