Welcome to JS Bin

JS Bin

Save
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>JS Bin</title>
  </head>
  <body>
    <p>Do Laundry</p>
    <p> Pay Rent </p>
    <p>Go to the gym</p>
    
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
    <button id="mark-complete">Mark Last Item as Completed</button>
  </body>
</html>
 
.strike-through {
  text-decoration: line-through;
}
 
$(() => {
  
   // 1. SELECT element with id of 'mark-complete'
   // 2. LISTEN for a click event using the .click() method,
   //    when a click event happens, CALL the completeItem function
  
  $('#mark-complete').click(() => {
    
    // 3. SELECT last p tag and add a class named 'strike-through
    //    using the .addClass method 
    //    (css file will have a style named '.strike-through')
    
    $('p:last-of-type').addClass('strike-through')
    
  })
})
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x