JSFiddle - React, Tailwind, and code Playground

by kurotanshi

HTML

<script src="https://unpkg.com/vue@next"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div id="vue-app">
  <h1>{{ message }}</h1>
  <input type="text" v-model="message">
</div>


<div id="jquery-app">
  <h1></h1>
  <input type="text" value="Hello World">
</div>

JavaScript

// vue
const app = Vue.createApp({
  data () {
    return {
    	message: 'Hello World!'
    }
  }
}).mount('#vue-app');


// jQuery
(function(){

  $('#jquery-app h1').text(   $('#jquery-app input') );
    
  $('#jquery-app input').on('input', function(e){
    var text = $(e.target).val();
    $('#jquery-app h1').text( text );
  });
})();