I try not to ask questions, but I can't figure out what should be very easy. I'm building a site for practice briannabaldwinphotography.com. I'm just trying to condense this so that I could just click on an anchor and it smooth scrolls to a `<section>` with an id the same name as the anchor. Ex: the 'about' li anchor has an href of `#section_three` and will scroll to the `<section>` with an id of `section_three`. I tried like 10 different variations and it won't work for me. Sort of what I'm looking for would be `$(this).attr("href").offest().top}`....etc. Here is the code I want to condense. Thanks. 

```
$(function() {
    $("[href='#section_three']").on("click", function() {
        $("html body").animate({"scrollTop":$("#section_three").offset().top}, 1000);
        return false;

    });
    $("[href='#section_two']").on("click", function() {
        $("html body").animate({"scrollTop":$("#section_two").offset().top}, 1000);
        return false;

    });
    $("[href='#section_four']").on("click", function() {
        $("html body").animate({"scrollTop":$("#section_four").offset().top}, 1000);
        return false;

    });
    $("[href='#section_one']").on("click", function() {
        $("html body").animate({"scrollTop":$("#section_one").offset().top}, 1000);
        return false;

    });

});

```