Question

how do i compare the two elements:

<a class="MenuSelected" href="c-4-kayaks-canoes.aspx">Kayaks &amp; Canoes</a>

and this:

<div class=title>Kayaks &amp; Canoes</div>

If it finds the text in div.title as the same then add css display:none

I am not sure what to try as its the text inside that i need comparing!
I cant hard code the string like in the example below.

$("div.title:contains('John')").css("display", "none");

Answer 1

$("div.title:contains('" + $("a.MenuSelected").text() + "')").hide();

or, more explicit but also more versatile (for example it allows to do case-insensitive comparisons):

$("div.title")
.filter(function () {
  return $(this).text().toLowerCase() == $("a.MenuSelected").text().toLowerCase();
})
.hide();

You could do $.trim() there as well, as @JaredFarrish suggests in the comments.

The :contains selector in comparison is case-sensitive and whitespace-sensitive, so it only selects exact matches.