Javascript 使用jQuery重新排列页面元素

我对jQuery和JavaScript比较陌生，我想我知道是什么导致了我的问题，但我不知道如何修复它

我使用simplewather.JS、moment.JS和moment.JS时区获取4个城市的当前时间和天气。我在页面上有我想要的所有数据，但我想将每个城市的时间移动到每个城市分区的第二段。关于如何使用我当前的代码或有没有更有效的方法生成此结果，有什么想法

以下是我的JS：

$(document).ready(function () {
    $('.weather').each(function () {
        var city = $(this).attr("city");
        var woeid = $(this).attr("woeid");
        var degrees = $(this).attr("degrees");
        var continent = $(this).attr("continent");

        $.simpleWeather({
            zipcode: '',
            woeid: woeid,
            location: '',
            unit: degrees,
            success: function (weather) {

                if (continent == 'America'){
                    html = '<p>' + weather.city + ', ' + weather.region + '</p>';
                }
                else {
                    html = '<p>' + weather.city + ', ' + weather.country + '</p>';
                }
                //html += '<p class="time" id="'+city+'></p>';
                //html += '<p>' + weather.updated + '</p>';
                html += '<p><i class="icon-' + weather.code + '"></i> ' + weather.temp + '&deg;' + weather.units.temp + '<p>';
                html += '<p>' + weather.currently + '<p>';


                $('#weather_' + city).html(html);
            },
            error: function (error) {
                $('#weather_' + city).html('<p>' + error + '</p>');
            }
        });
    });


     $(function () {
        setInterval(function () {
            $('.time').each(function () {
                var city = $(this).attr("city");
                var continent = $(this).attr("continent");
                //$(this).text(city);
                var utc = moment.utc().format('YYYY-MM-DD HH:mm:ss');
                var localTime = moment.utc(utc).toDate();
                cityTime = moment(localTime).tz(continent + "/" + city).format('ddd MMM D YYYY, h:mm:ss a z');
                $(this).text(city+ ': '+cityTime);
            });
        }, 1000);


    });

         $('.time').each(function () {
             var city = $(this).attr("city");
             //$('#weather_' + city).after(this);

         });  



});

$（文档）.ready（函数（）{
$（'.weather'）。每个（函数（）{
var city=$（this.attr（“city”）；
var woeid=$（this.attr（“woeid”）；
变量度=$（此）.attr（“度”）；
var大陆=$（this.attr（“大陆”）；
$.SimpleWither({
zipcode:“”，
沃伊德：沃伊德，
位置：“”，
单位：度，
成功：功能（天气）{
如果（大陆=‘美国’）{
html=“”+weather.city+”、“+weather.region+”
”；
}
否则{
html=“”+weather.city+”、“+weather.country+”
”；
}
//html+='您可以使用方法将时间附加到具有相同城市属性的相应
中，如使用选择器：

 $(this).text(city + ': ' + cityTime).appendTo("div[city='"+city+"']");


更改：

            $(this).text(city+ ': '+cityTime);

致：

var timeP=$（'p.time'，'weather'+城市）；
timeP=timeP.length？timeP:$（'
'，{class:'time'}）.appendTo（'#weather.'+city）；
timeP.text（城市时间）；
您的自定义属性应该以数据为前缀-以传递w3c。就像数据城市一样。
$（函数（）{}）
是
ready（）
的快捷方式，因此您在另一个
ready（）中有一个ready处理程序
handler，这是不必要的…感谢您的快速回复和帮助。是否有任何方法可以轻松地将其显示在城市、州/国家线的正下方？谢谢！我一直在思考如何将其定位在我想要的位置。有很多东西需要学习！
            var timeP = $('p.time','#weather_' + city);
            timeP = timeP.length ? timeP : $('<p/>',{class:'time'}).appendTo( '#weather_' + city );
            timeP.text(cityTime);