Question

trying to select next option drop down list by using a id identifier, but to no avail

here is the code

$('#chapter option:selected', 'select').removeAttr('selected').next('option').attr('selected', 'selected')

Answer 1

I assume #chapter is the <select> or one of its ancestors.

If that’s the case, remove the context argument.

$('#chapter option:selected').removeAttr('selected')
              .next('option').attr('selected', 'selected');

The way you had it, you were effectively doing this:

$('select').find('#chapter option:selected').removeAttr(...

…which is looking for an element inside the <select> that has an option:selected descending from an elelent with the chapter ID.

---

EDIT: This answer was focused merely on why the selection wasn’t working. It would be better to accomplish the ultimate task using the method in @Andy E’s answer.

I’d recommend that one as the Accepted answer.