Html make text clickable without making it a hyperlink

place the text in a span or other element with a class <span class="yourClass">text</span> and then use javascript to add an event listener (preferably at the end of your html. for brevity, I'll demonstrate with jQuery, though it could be done with native javascript.

<script>
  $('.yourClass').on('click',function(){
    //your javacript
  });
</script>

Alternatively you could do search through all the page for instances of that word, though I would not recommend that as it would really slow things down.


For semantics I'd use a <button> element like this:

<button class="link">Clicky</button>

to make the button look like normal text you can use CSS:

button.link { background:none; border:none; }

and for easiness of handing click I'd use jQuery like so:

$(".link").on("click", function(e) {
    // e is the event object
    // this is the button element
    // do stuff with them
});

Although if you have an ID attribute on the button you can use plain JS like this:

var button = document.getElementById("your-button-id");
button.addEventListener("click", function(e) {
    // e is the event object
    // e.target is the button element
    // do stuff with them
});

The apropriate element for an interactive control that isn't a link somewhere is a <button>Label</button> or (<input type="button" value="Label">). (You can always style away the border and background with CSS).

You can bind a click event handler to it using the standard DOM APIs (or a library that abstracts them such as YUI or jQuery).


<div id="text" onClick="function()"> your text here </div>