JSFiddle - React, Tailwind, and code Playground

by thecodeparadox

HTML

<a id="working" href="#">working</a> <a id="notWorking" href="#">not working</a>
<div id="container">
<div class="question-summary narrow" id="question-summary-5028329">
    <div onclick="window.location.href='/questions/5028329/ios-4-2-return-to-app-after-phone-call'" class="cp">
        <div class="votes">
            <div class="mini-counts">6</div>
            <div>votes</div>
        </div>
        <div class="status answered-accepted" title="one of the answers was accepted as the correct answer">
            <div class="mini-counts">4</div>
            <div>answers</div>
        </div>
        <div class="views">
            <div class="mini-counts warm"><span title="2101 views">2</span></div>
            <div class="warm">kviews</div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="/questions/5028329/ios-4-2-return-to-app-after-phone-call" class="question-hyperlink" title="I can successfully initiate a phone call within my app using the following:

[[UIApplication sharedApplication] openURL:[NSURL URLWithString:@&quot;tel://123456789&quot;]];


However, is it possible to ...">iOS 4.2 - Return to app after phone call</a></h3>
        <div class="tags t-iphone t-ios">
            <a href="/questions/tagged/iphone" class="post-tag" title="show questions tagged 'iphone'" rel="tag">iphone</a> <a href="/questions/tagged/ios" class="post-tag" title="show questions tagged 'ios'" rel="tag">ios</a> 
        </div>
        <div class="started">
            <a href="/questions/5028329/ios-4-2-return-to-app-after-phone-call/?lastactivity" class="started-link"><span title="2012-05-17 11:38:38Z" class="relativetime">12s ago</span></a>
            <a href="/users/917476/frin">frin</a> <span class="reputation-score" title="reputation score" dir="ltr">3</span>
        </div>
    </div>
</div>
</div>

JavaScript

var div = $('#container').find(' > div')
for (var i = 0; i < 300; i++)
    div.clone().appendTo('#container');

$('#container').find(' > div').clone().hide().appendTo('#container');

                        
$('#working').click(function() {
    var visible = $('#container').find(' > div:visible'),
        hidden = $('#container').find(' > div:hidden');
    
    visible.fadeOut(1000, function() {
    });
    setTimeout(function() { hidden.fadeIn('slow') },1000);
});


$('#notWorking').click(function() {
    var visible = $('#container').find(' > div:visible');

    visible.fadeOut(1000, function() {
        var hidden = $('#container').find(' > div:hidden')
        hidden.fadeIn(100)
    });
});