Question

I am trying to target a div that is generated by a jQuery plugin. I have been trying to do this using .next but with no luck.

Update: Please note this generated div is triggered by a click

*Update:Here is a fiddle of the code http://jsfiddle.net/clintongreen/PAbAH/1/

The problem is, the next selector ignores the generated div and targets the next div. I understand that this is not working because the generated div is technically not a sibling.

Does anyone have an idea how I can target this elusive generated div. I can’t use css because I only want to hide it when it is generated from certain links.

Code example

//Script
$("div.region_marker").next("div.bubble").hide();

//HTML
<div class="region_marker">Region Marker text</div> //this is how I am targeting the generated div
<div class="bubble">Bubble text</div> //div generated by jQuery, not hard coded, this is ignored by .next
<div class="map_marker">Map Marker text</div> //random div, this is the one that .next targets
<div class="map_marker">Map Marker text</div> //random div

I am open to any suggestions you have, thanks guys

Answer 1

Thanks I got it working using:

$(“div.region_marker”).click(function() { $(this).next(“.bubble”).hide(); });

It works now using the click function to trigger this at the same time, the traditional methods were not working because I ran those functions before the div.bubble was loaded.