0

i have this jquery code:

$(document).ready(function(){
	//Hide the tooglebox when page load
	$(".visit").hide();
	$("#suppliers-table td").hover(function(){	
		$(".visit").show();
	});
});

for this html:

<table id="suppliers-table">
			                	<tr>
			                		<td><p class="suppliers-name">ASD</p><a class="visit" href="#">Visit Website</a></td>
			                		<td><p class="suppliers-name">ASD</p><a class="visit" href="#">Visit Website</a></td>
			                		<td><p class="suppliers-name">ASD</p><a class="visit" href="#">Visit Website</a></td>
			                		<td><p class="suppliers-name">ASD</p><a class="visit" href="#">Visit Website</a></td>
			                		<td><p class="suppliers-name">ASD</p><a class="visit" href="#">Visit Website</a></td>
			                	</tr>

What i need to happen is when they hover over a td for the hyperlink:"visit website" to appear and the go again when the hover off. And only appear for that td, not all of them

I know the jquery is wrong above but if someone can correct it that would be great

1
Contributor
1
Reply
2
Views
6 Years
Discussion Span
Last Post by benhowdle89
0

Sorry didnt realise you could put two selectors in

$(document).ready(function(){
	//Hide the tooglebox when page load
	$(".visit").hide();
	$("#suppliers-table td").hover(function(){	
		$(".visit", this).toggle();
	});
});
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.