VueJs 2 vs JQuery Comparision - jquery

index.html

<!-- https://youtu.be/HQDkXTlgY14 -->
<input type="text" class="js-filter"> Full Regular Expression Search (case insensitive)
<ul class="js-posts"></ul>

script.js

var people = ['Apple','Banana','Orange','Facebook','Twitter','Youtube'];
// Remove any items that might already exist
$('.js-posts').empty();
// Add the items to the DOM
$.each(people, function(index,person){
	$('.js-posts').append("<li>"+ person +"</li>");
});
// Listen to when the input changes
$('.js-filter').on('keyup', function(){
	// Get the search value
	var value = $(this).val();
	// Hide all posts
	$('.js-posts li').hide();
	// Only show the posts that match
	$('.js-posts li').filter( function(){
    var text = $(this).text();
    return Array.isArray( text.match( new RegExp(value, 'i') ) );
  }
  ).show();
});

scripts

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

vuejs-2-vs-jquery-comparision-jquery.markdown

VueJs 2 vs JQuery Comparision - jquery

A Pen by thinsoldier on CodePen.

License.