jQuery Plugin To Show Html Markup Of An Element - showMarkup

A tiny jQuery plugin designed for code tutorial web page that allows to show the HTML markup of an element and its children.

How to use it:

1. Include the latest version of jQuery library and the jQuery showMarkup plugin in the web page.

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="dist/jquery.showMarkup.min.js"></script>

2. Call the plugin on where you want to show the Html markup.

$('.demo').showMarkup();

3. You can set the plugin to show/hide the Html markup of an Html element by clicking on a toggle button.

<button class="show-markup">Show Markup</button>
<button class="hide-markup">Hide Markup</button>

$('.demo').showMarkup({
'buttonShow':'.show-markup',
'buttonHide':'.hide-markup',
initShow:false
});

---

This awesome jQuery plugin is developed by longmatthewh. For more Advanced Usages, please check the demo page or visit the official website.