Need: Find a way to add a valid tag/attribute/property to a normal html control.
What I have is some javascript/jquery adding a click event to a link that will show or hide a div. The idea is to do this using $(document).ready and an anonymous method to create the method called by onClick at the page load. When clicked, a div will be shown with some text. This is all well and good except I can't figure out how to set up the text so that this can be done on the page load. What I'd like is something like:
<a href="..." class="showItLink" textToShow="This is the text to show">HI</a>
so that I can do this:
$(document).ready
(
function()
{
$("..showItLink").click
(
function(event)
{
var containerPosition;
var createdDiv;
//see if the div already exists
createdDiv = $(this).children(".postComment");
if (createdDiv.length == 0)
{
//This is where the attribute is used so that the CreateDiv
//method can take the textToShow and fill the div's innerText
//with it V V V V V V
createdDiv = CreateDiv(this.textToShow, "postComment");
$(this).append(createdDiv);
$(this).children(".postComment").hide();
}
$(createdDiv).toggle();
event.preventDefault();
}
);
}
);
Now besides not being xhtml valid (meh), this only works in IE. Firefox just says it doesn't exist. (this.textToShow) I could use something like rel or rev, but that seems just as hackish. I was wondering if there is a valid way of doing this.
Solution from answer below
comment = $(".showItLink").attr("comment");
...
createdDiv = CreateDiv(comment, "postComment");
Paired with:
<a href="http://www.theironical.com" class="showItLink" comment="hihihi" >HI</a>