Cycled items from array this might be useful

const currentIndex = items.indexOf(currentItem);
const nextIndex = (currentIndex + 1) % items.length;
items[nextIndex];

The first item will be taken from the beginning of the array after the last item

Try this String.prototype function:

String.prototype.cycle = function(arr) {
  const i = arr.indexOf(this.toString())
  if (i === -1) return undefined
  return arr[(i + 1) % arr.length];
};

Here is how you use it:

"a".cycle(["a", "b", "c"]); // "b"
"b".cycle(["a", "b", "c"]); // "c"
"c".cycle(["a", "b", "c"]); // "a"
"item1".cycle(["item1", "item2", "item3"]) // "item2"

If you want to do it the other way round, you can use this Array.prototype function:

Array.prototype.cycle = function(str) {
  const i = this.indexOf(str);
  if (i === -1) return undefined;
  return this[(i + 1) % this.length];
};

Here is how you use it:

["a", "b", "c"].cycle("a"); // "b"
["a", "b", "c"].cycle("b"); // "c"
["a", "b", "c"].cycle("c"); // "a"
["item1", "item2", "item3"].cycle("item1") // "item2"

I think that an object could be probably a better data structure for this kind of task

items = {
  ball : "1f7g",
  spoon: "2c8d", 
  pen  : "9c3c"
}


console.log(items['ball']); // 1f7g

Here is an example as a one-liner to get the prev/next element in the array (returns null if element does not exist in the array):

var arr = [1, 2, 3];
var current = 3;

var next = arr.includes(current) ? arr[(arr.indexOf(current) + 1) % arr.length] : null;

console.log(next) // output: 1

var prev = arr.includes(current) ? [...arr.reverse()][(arr.indexOf(current) + 1) % arr.length] : null;

console.log(prev) // output: 2

You may pass array to function as argument and return found value from function:

var item = "spoon"; // from user input
var arr = ["ball", "1f7g", "spoon", "2c8d", "pen", "9c3c"]; //making the array
function findcode(item, arr){
    var idx = arr.indexOf(item);  //search array for whatever the user input was
    if(idx >=0 && idx <= arr.length - 2) { // check index is in array bounds
        return arr[i+1]; // return whatever comes next to item
    }
    return '';
}
document.write(findcode(item, arr)); //write the code, i.e., whatever comes after the item

Answer for 2022

This question came up when I was searching for a modern way to do this. I had been using the technique described in SerzN1's excellent answer without the wraparound (because I don't want that to happen). It winds up being quite a bit of code to make it safe, so I wanted something more modern.

As it turns out, there is a feature that has been available in every major browser since 2016. If someone hasn't updated their browser in six years, that's their loss, right?

ES2015 Array.find()

This function is used for finding a specific element in an array. That's exactly what we want to do here. The only problem is it doesn't maintain state for you, so you can only find a matching element, not the one after (or before, for that matter). To get around that, we use a closure.

Here's the short version:

let trigger = false;
const found = arr.find(element => trigger || (trigger = element === value) && !trigger);

You start with trigger set to false because we need to keep track of when the element is found (if at all). Then we use the Array.find() on the list we should be searching. The single argument to that function is a search function, which we define in-line as a closure so it has access to trigger.

The search function is the tricky part: element => trigger || (trigger = element === query.value) && !trigger. It might be easier to read if I break it apart into a more conventional function just so we can evaluate it. I'll describe what's happening in the comments:

function (element) {
  // If trigger is true, that means the previously-evaluated element was the match.
  // Therefore, we must be currently evaluating one AFTER it.
  // We should match on this one.
  if (trigger === true) return true;
  // Then we update the value of trigger to the result of comparing the element with the search value
  trigger = (element === value)
  // Now we `and` it together with its negation in order to make sure
  // it always returns false even when the element matches the search value
  return trigger && !trigger
}

And there you have it! It only takes two lines of code to get the element after one that matches your query.

Want to see it in action? Here you go:

function showNext() {
  const query = document.getElementById('query');
  if (query === null) return;
  const result = document.getElementById('result');
  if (result === null) return;
   var arr = ["ball", "1f7g", "spoon", "2c8d", "pen", "9c3c"];
  
  // This is the important part
  // Create a boolean flag that will inform the find function when it passes
  // the matching element in its search
  let trigger = false;
  const found = arr.find(element => trigger || (trigger = element === query.value) && !trigger);

  // Now `found` is equal to the array element AFTER the one you searched for
  // If it is undefined, that means the one you searched for was either the last
  // element in the array or it was missing.
  result.innerText = `Found ${found ?? 'nothing'}`;
}

<input id="query" />
<input type="submit" value="Display next" onclick="showNext()" />
<div id="result"></div>