Skip to content

Instantly share code, notes, and snippets.



Last active Feb 14, 2017
What would you like to do?
Simple class based jaavascript filtering solution using data attributes
$(".filters .filters__wrapper ul").on("click", "li", function () {
// Set clicked element as active
// Get the class to filter by
var filterClass = $(this).data("filter").trim();
// Get the grid this filter applies to (use data-grid="#some-id-here")
var gridIdentifier = $(this)
// Get grid items
var items = $(gridIdentifier).children(".grid__item");
// Show/Hide based on their class
for (var i = 0; i < items.length; i++) {
var item = $(items[i]);
if (filterClass == "*" || filterClass == "") {
} else if (!item.hasClass(filterClass)) {
} else {
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.