one-liner seek button

<button onclick="recipeVideo.currentTime=this.innerText.split(':').reverse().reduce((s,t,i)=>s+t*[1,60,3600][i],0);">0:24</button>

e.g.

<video id="recipeVideo" src="my-recipe.mp4" controls></video>
<ul>
  <li><button onclick="recipeVideo.currentTime=this.innerText.split(':').reverse().reduce((s,t,i)=>s+t*[1,60,3600][i],0);">0:24</button> Sautée mushrooms</li>
  <li><button onclick="recipeVideo.currentTime=this.innerText.split(':').reverse().reduce((s,t,i)=>s+t*[1,60,3600][i],0);">1:17</button> Drain pasta</li>
</ul>

For use in contexts where a <script> tag may not be parsed or sourced, such as a browser extension/add-on rendering Markdown.

Breaking it down:

// a button has an `onclick` expression of:
recipeVideo // A reference to the `<video>` element. Could be something like `document.querySelector('article video')`
  .currentTime // Video time position in seconds
  = this // The button being clicked
    .innerText // The timecode text like "01:07:03" or "00:15" (must be the ONLY text in the button)
    .split(':') // Break into segments
    .reverse() // Ascending scale, to allow for short or long timecodes
    .reduce(
      (seconds, timecodeSegment, index) => seconds + timecodeSegment * [1, 60, 3600][index],
      // ^ Reduce ascending timecode segments to seconds (seconds = *1, minutes = *60, hours = *3600)
      0 // Starting off the sum with 0 seconds.
    );