Question: I recently discovered this script: [JS fiddle text swapper](http://jsfiddle.net/PMKDG/) - but I'd like to add a nice fade in and fade out.

I guess this is a 2 part question.

1. Can I add fadeIn the way this is structured?
2. I'm guessing I'll also need a FadeOut?

Help would be greatly appreciated!

Thanks

```
$(function() {
    $("#all-iso, #date-iso, #actor-iso, #film-iso").on("click", function(e) {
        var txt = "";
        switch ($(this).prop("id")) {
            case "all-iso":
                txt = "ALLE NEWS";
                break;
            case "date-iso":
                txt = "DATUM";
                break;
            case "actor-iso":
                txt = "SCHAUSPIELER";
                break;
            case "film-iso":
                txt = "FILM";
                break;
        }
        $("#news-h3-change").text(txt);
    })
})

```

Answer: 
Try

```
    $("#news-h3-change").fadeOut(function(){
        $(this).text(txt)
    }).fadeIn();

```

Demo: [Fiddle](http://jsfiddle.net/arunpjohny/93WG6/)

I might suggest to use `data-*` to make it little more nice, like

```
<ul id="iso">
    <li data-txt="ALLE NEWS">all-iso</li>
    <li data-txt="DATUM">date-iso</li>
    <li data-txt="SCHAUSPIELER">actor-iso</li>
    <li data-txt="FILM">film-iso</li>
</ul>

<h3 id="news-h3-change"></h3>

```

then

```
$(function () {
    $("#iso > li").on("click", function (e) {
        var txt = $(this).data('txt');
        $("#news-h3-change").stop(true, true).fadeOut(function () {
            $(this).text(txt)
        }).fadeIn('slow');
    })
})

```

Demo: [Fiddle](http://jsfiddle.net/arunpjohny/dmZ5W/)
Here is another way to do it [JSFiddle](http://jsfiddle.net/PMKDG/29/)

```
$(function() {
    $("#all-iso, #date-iso, #actor-iso, #film-iso").on("click", function(e) {
        var txt = "", id = $(this).prop("id");
        $('#news-h3-change').fadeOut('slow', function() {
            switch (id) {
            case "all-iso":
                txt = "ALLE NEWS";
                break;
            case "date-iso":
                txt = "DATUM";
                break;
            case "actor-iso":
                txt = "SCHAUSPIELER";
                break;
            case "film-iso":
                txt = "FILM";
                break;
            }
            $(this).text(txt);
            $("#news-h3-change").fadeIn('slow');
        });
    })
})

```