Anagram Function

A working example of a function that checks if two strings are anagrams of each other.

by meetravi

HTML

<label for="string1">String 1</label>
<input type="text" id="string1" placeholder="String 1" />

<label for="string2">String 2</label>
<input type="text" id="string2" placeholder="String 2" />
<button class="checkAna">Check Anagram</button>
<div class="results"></div>

CSS

body {
    font-family: 'Helvetica', 'Arial', 'sans-serif';
    font-size: 12px;
}
label {
    display: inline-block;
}
input {
    display: block;
    margin-bottom: 20px;
}
.results {
    display: none;
}
.error {
    background-color: #FFAAAA;
}

JavaScript

$(document).ready(function() {
    // HERE IS THE FUNCTION :D
    var anagram = function(str1, str2){
      return str1.split("").sort().join("") === str2.split("").sort().join("");
    }
    // THAT WAS THE FUNCTION :D
    
    $('.checkAna').on('click', function(e) {
        e.preventDefault();
        if($('#string1').val() == '') {
            $('#string1').addClass('error');
            if($('#string2').val() == '') {
                $('#string2').addClass('error');
            }
            $('.results').empty();
            $('.results').hide();
        } else {
            $('#string1').removeClass('error');
            if($('#string2').val() == '') {
                $('#string2').addClass('error');
                $('.results').empty();
                $('.results').hide();
            } else {
                $('#string2').removeClass('error');
                var isAnagram = anagram($('#string1').val(), $('#string2').val());
                $('#string1').val('');
                $('#string2').val('')
                $('.results').show();
                $('.results').empty().append('Is Anagram: ' + isAnagram);
            }
        }
    });
    
    
});