Click visible button in protractor?

I have a page which looks something like this. It's a wizard with steps. Depending on the "step" scope variable, a different part of the wizard is shown:

<div ng-show="step == 'first'">
  <button>Next</button>
</div>

<div ng-show="step == 'second'">
  <button>Next</button>
</div>

<div ng-show="step == 'third'">
  <button>Next</button>
</div>

To click the next button I run into problems though. Because there are three of them. The following code returns all of them:

var next = element(by.buttonText('Next'));

And doing:

next.click();

will click the first one. How can I find the visible button only, and click that one?