Whitespace
##Whitespace YouYou seem to end at a different indentation than you start. This means the indentation is messed up somewhere. (looking at it, your ending brace for match is incorrect, causing the rest to be indentated wrongly too.)
click and keypress handler
##click and keypress handler ActivatingActivating a button with the mouse, touch or a key all fires the click handler as far as I know. Attach the click handler via javascript instead of adding it to the html:
$("#buton").on("click", find);
Don't (deliberatelly) mispell the id of a button, just because it clashes with a different button. If someone decides to correct your spelling mistake, suddenly you have a naming conflict. Instead call them something more descriptive, e.g. btn-clear-results and btn-search.
Comments behind code
##Comments behind code CommentsComments behind code make the comments near unreadable. The standard width is 80 columns or so. Having to scroll left and right does not increase the readability of code.
It's better to add comments to logical parts of code than to each line. For example, i = i + 1; //i gets incremented is not useful, because everyone that is familiar with a specific function can tell what is going on. On the other hand, commenting on the larger logical steps that are taken is much more useful.
.val()
###.val()
TheThe .val() method returns the value of the first element matched by the preceding query. I am not sure if .val() makes sense for non-form element(s).
$.getJSON(..)
###$.getJSON(..)$.getJSON(..) is a shorthand for $.ajax(..) with some specific values. It parses the result with $.parseJSON(..) (which may or may not fall through to JSON.parse(..)), which is why you are not working on a string, but instead on native Array's and Objects.
Array.prototype.filter(..)
###Array.prototype.filter(..)Array.prototype.filter(..) executes a function on each value of an Array. If the function returns true, the value is kept. If it returns false, the value is discarded. The [0] at the end takes the first value of that array.
If the array is empty, item will be undefined.
.done(..) and .fail(..)
###.done(..) and .fail(..)
AjaxAjax requests in jQuery are a promise. The .done(..) handler is called when the request was succesful. The .fail(..) handler is called when the request was not succesful. E.g. the url returned a non-2xx or 3xx status code and it could not be completed, or it timed out.
The rest
##The rest TheThe rest seems reasonable to me. You use strict comparison. I don't see any variables being dropped into the global namespace, and you consistently close statements with a semicolon. Your style is reasonably constant too.
##Whitespace You seem to end at a different indentation than you start. This means the indentation is messed up somewhere. (looking at it, your ending brace for match is incorrect, causing the rest to be indentated wrongly too.)
##click and keypress handler Activating a button with the mouse, touch or a key all fires the click handler as far as I know. Attach the click handler via javascript instead of adding it to the html:
$("#buton").on("click", find);
Don't (deliberatelly) mispell the id of a button, just because it clashes with a different button. If someone decides to correct your spelling mistake, suddenly you have a naming conflict. Instead call them something more descriptive, e.g. btn-clear-results and btn-search.
##Comments behind code Comments behind code make the comments near unreadable. The standard width is 80 columns or so. Having to scroll left and right does not increase the readability of code.
It's better to add comments to logical parts of code than to each line. For example, i = i + 1; //i gets incremented is not useful, because everyone that is familiar with a specific function can tell what is going on. On the other hand, commenting on the larger logical steps that are taken is much more useful.
###.val()
The .val() method returns the value of the first element matched by the preceding query. I am not sure if .val() makes sense for non-form element(s).
###$.getJSON(..)$.getJSON(..) is a shorthand for $.ajax(..) with some specific values. It parses the result with $.parseJSON(..) (which may or may not fall through to JSON.parse(..)), which is why you are not working on a string, but instead on native Array's and Objects.
###Array.prototype.filter(..)Array.prototype.filter(..) executes a function on each value of an Array. If the function returns true, the value is kept. If it returns false, the value is discarded. The [0] at the end takes the first value of that array.
If the array is empty, item will be undefined.
###.done(..) and .fail(..)
Ajax requests in jQuery are a promise. The .done(..) handler is called when the request was succesful. The .fail(..) handler is called when the request was not succesful. E.g. the url returned a non-2xx or 3xx status code and it could not be completed, or it timed out.
##The rest The rest seems reasonable to me. You use strict comparison. I don't see any variables being dropped into the global namespace, and you consistently close statements with a semicolon. Your style is reasonably constant too.
Whitespace
You seem to end at a different indentation than you start. This means the indentation is messed up somewhere. (looking at it, your ending brace for match is incorrect, causing the rest to be indentated wrongly too.)
click and keypress handler
Activating a button with the mouse, touch or a key all fires the click handler as far as I know. Attach the click handler via javascript instead of adding it to the html:
$("#buton").on("click", find);
Don't (deliberatelly) mispell the id of a button, just because it clashes with a different button. If someone decides to correct your spelling mistake, suddenly you have a naming conflict. Instead call them something more descriptive, e.g. btn-clear-results and btn-search.
Comments behind code
Comments behind code make the comments near unreadable. The standard width is 80 columns or so. Having to scroll left and right does not increase the readability of code.
It's better to add comments to logical parts of code than to each line. For example, i = i + 1; //i gets incremented is not useful, because everyone that is familiar with a specific function can tell what is going on. On the other hand, commenting on the larger logical steps that are taken is much more useful.
.val()
The .val() method returns the value of the first element matched by the preceding query. I am not sure if .val() makes sense for non-form element(s).
$.getJSON(..)
$.getJSON(..) is a shorthand for $.ajax(..) with some specific values. It parses the result with $.parseJSON(..) (which may or may not fall through to JSON.parse(..)), which is why you are not working on a string, but instead on native Array's and Objects.
Array.prototype.filter(..)
Array.prototype.filter(..) executes a function on each value of an Array. If the function returns true, the value is kept. If it returns false, the value is discarded. The [0] at the end takes the first value of that array.
If the array is empty, item will be undefined.
.done(..) and .fail(..)
Ajax requests in jQuery are a promise. The .done(..) handler is called when the request was succesful. The .fail(..) handler is called when the request was not succesful. E.g. the url returned a non-2xx or 3xx status code and it could not be completed, or it timed out.
The rest
The rest seems reasonable to me. You use strict comparison. I don't see any variables being dropped into the global namespace, and you consistently close statements with a semicolon. Your style is reasonably constant too.
##Whitespace You seem to end at a different indentation than you start. This means the indentation is messed up somewhere. (looking at it, your ending brace for match is incorrect, causing the rest to be indentated wrongly too.)
##click and keypress handler Activating a button with the mouse, touch or a key all fires the click handler as far as I know. Attach the click handler via javascript instead of adding it to the html:
$("#buton").on("click", find);
Don't (deliberatelly) mispell the id of a button, just because it clashes with a different button. If someone decides to correct your spelling mistake, suddenly you have a naming conflict. Instead call them something more descriptive, e.g. btn-clear-results and btn-search.
##Comments behind code Comments behind code make the comments near unreadable. The standard width is 80 columns or so. Having to scroll left and right does not increase the readability of code.
It's better to add comments to logical parts of code than to each line. For example, i = i + 1; //i gets incremented is not useful, because everyone that is familiar with a specific function can tell what is going on. On the other hand, commenting on the larger logical steps that are taken is much more useful.
###.val()
The .val() method returns the value of the first element matched by the preceding query. I am not sure if .val() makes sense for non-form element(s).
###$.getJSON(..)
$.getJSON(..) is a shorthand for $.ajax(..) with some specific values. It parses the result with $.parseJSON(..) (which may or may not fall through to JSON.parse(..)), which is why you are not working on a string, but instead on native Array's and Objects.
###Array.prototype.filter(..)
Array.prototype.filter(..) executes a function on each value of an Array. If the function returns true, the value is kept. If it returns false, the value is discarded. The [0] at the end takes the first value of that array.
If the array is empty, item will be undefined.
###.done(..) and .fail(..)
Ajax requests in jQuery are a promise. The .done(..) handler is called when the request was succesful. The .fail(..) handler is called when the request was not succesful. E.g. the url returned a non-2xx or 3xx status code and it could not be completed, or it timed out.
##The rest The rest seems reasonable to me. You use strict comparison. I don't see any variables being dropped into the global namespace, and you consistently close statements with a semicolon. Your style is reasonably constant too.