发出淡出选择器的问题

Question

I am trying to fade out a clicked ul element. Here is the thing, I have multiple ul elements that contain the same class name for when selecting. To handle that I am phasing out a id for each specific ul to know which element to fade out. My issue is though, when trying to fade out the ul element. Nothing happens at all, even though it contains the correct id .

Here is what I am doing:

$(".start-dropdownClose").click(function(event){
       event.stopPropagation();
       $thisOne = $($(this).parent().parent().attr('id'));
       $($thisOne.selector).fadeOut();
});

When I alert the $thisOne.selector it displays the correct id of that selected ul element. I just don't know why it wont fade out though?

Suggestions, thoughts?

Answer 1

Don't use its selector, just use the element object:

$(".start-dropdownClose").click(function(event){
   event.stopPropagation();
   $(this).parent().parent().fadeOut();
});

Answer 2

Try these two approaches:

$(".start-dropdownClose").click(function(event){
       event.stopPropagation();
       $thisOne = $(this).parent().parent();
       $thisOne.fadeOut();
});

or

$(".start-dropdownClose").click(function(event){
       event.stopPropagation();
       $thisOne = $($(this).parent().parent().attr('id'));
       $("#"+$thisOne).fadeOut();
});

The first one $thisOne is the ul you are trying to select and fadeout. So just fading it out should work.

In the second approach, $thisOne is an id string, so to select it correctly with jQuery the correct syntaxis is $("#idString")