How I added a link beside an input tag using an a tag in JQuery

I needed to display a list of check boxes with descriptors that also act as links and give information when clicked. I couldn’t find reliable information by searching online and put together what worked for me as follows:

Firstly an input tag cannot have any html before it’s closing /> tag.
var a_href = '<a href="' + value.permalink;
var li = $('<li><input type="checkbox" name="school" id="' + value.id
+ '"/>' + a_href + '">' + value.title + '</a></li>');

So basically after the li tag opening followed by input tag opening and closing, we follow up with an a tag and finally close the li tag as shown above. Here value is a data object that we are using to populate the data.

It is easy to append the var li to the document using jQuery.

Posted in HTML, JQuery.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.