JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container-fluid">
<div class="row">
<h2 class="demo-text">LineControl Demo</h2>
<div class="container">
<div class="row">
<div class="col-lg-12">
<textarea id="txtEditor">Default value ? No ! It's not working ...</textarea>
</div>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://raw.githubusercontent.com/suyati/line-control/master/editor.js"></script>
CSS
@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css');
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css');
@import url('https://raw.githubusercontent.com/suyati/line-control/master/editor.css');
.Editor-container {
border: 1px solid lightgray; padding: .25rem; border-radius: 3px;
}
.Editor-editor {
margin-top: .5rem;
padding: 1rem;
background-color: #d5d5d5;
}
#statusbar * {
color: lightgray;
}
JavaScript
$(document).ready(function() {
$('#txtEditor').Editor();
$('#txtEditor').Editor('setText', 'My text with <strong>LineControl</strong> :)');
});