Menu
I'm trying to get a jQuery selector for the child of a sibling (multiple sections on the page so need to just reach the sibling's child (rather thna being able to use a general selector).
HTML:
<div class="tour-section"> <div class="screenshots left"> <div class="tab tab1"></div> <div class="tab tab2"></div> <div class="tab tab3"></div> <div class="tab tab4"></div> </div> <div class="talking-point section1"> <h2 class="primary-color-text">Create your listing</h2> <p class="subheader">Create your job listing by adding a few simple details</p> </div> </div> JS:
$(".talking-point.section1").mouseenter(function() { $(this).siblings(".screenshots").children("tab").hide(); $(".screenshots .tab1").show(); $(this).siblings(".screenshots").css("background-position","0 0"); }); 
738
Just like in real life with real families, siblings are elements with the same parent element. The elements with IDs 2, 3, and 4 are all siblings of each other, and are children of element with ID 1.
The ("parent > child") selector selects all elements that are a direct child of the specified element.
jQuery siblings() Method Sibling elements are elements that share the same parent. The DOM tree: This method traverse forward and backwards along siblings of DOM elements. Tip: Use the prev() or next() method to narrow down the search for only previous or next sibling elements.
Adjacent Sibling Selector (+) The adjacent sibling selector is used to select an element that is directly after another specific element. Sibling elements must have the same parent element, and "adjacent" means "immediately following".
Logically it should work. You're missing a dot . for the .children() Jquery selector.
.children(".tab") Using find instead of children worked for me:
$(this).siblings(".screenshots").find("tab") If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
